← Cloudflare Workers / workers / wrangler / migration / v1-to-v2

1. Migrace projektů webpack

Tento průvodce popisuje kroky migrace projektu webpack z Wrangler v1 na Wrangler v2. Po dokončení tohoto průvodce aktualizujte verzi Wrangler.

Předchozí verze Wrangleru nabízely základní podporu pro webpack ↗ hodnotou type a webpack_config klíče v Konfigurační soubor Wrangler. Od Wrangleru v2 už Wrangler nepodporuje type a webpack_config klíče, ale webpack můžete se svými Workery nadále používat.

Pokud jako vývojář používáte webpack s Workers, můžete patřit do jedné ze čtyř kategorií:

1. Používám [build] pro spuštění webpacku (nebo jiného bundleru) mimo wrangler..

2. Používám type = webpack, ale vlastní konfiguraci neposkytuji a nechávám to na Wrangleru..

3. Používám type = webpack a webpack_config = <path/to/webpack.config.js> ke zpracování JSX, TypeScript, WebAssembly, HTML souborů a dalších nestandardních typů souborů..

4. Používám type = webpack a webpack_config = <path/to/webpack.config.js> pro provádění transformací kódu a další funkce upravující kód..

Pokud se v tomto výčtu nenacházíte, nahlásit problém ↗ a my vám pomůžeme s vaší konkrétní situací a tento návod pro budoucí čtenáře vylepšíme.

Wrangler v2 podporuje [build] klíč, aby se vaše Workery nadále sestavovaly podle vašeho vlastního nastavení.

Wrangler se o to bude i nadále starat. Odeberte type = webpack z vašeho souboru Wrangler.

Od verze Wrangler v2 má Wrangler pro tento případ použití vestavěnou podporu. Více informací najdete v Bundling pro další podrobnosti.

Workers runtime zpracovává JSX a TypeScript. Můžete import libovolné moduly, které potřebujete, do svého kódu, a Workers runtime je automaticky zahrne do sestaveného Workeru.

Měli byste odstranit type a webpack_config klíče ze souboru Wrangler.

Wrangler v2 ruší podporu typů projektů, včetně type = webpack a konfiguraci prostřednictvím webpack_config klíč. Pokud vaše konfigurace webpacku provádí operace nad rámec přidávání loaderů (například pro TypeScript), budete muset svou vlastní konfiguraci webpacku udržovat i nadále. Z dlouhodobého hlediska byste měli migrace na externí [build] proces. Krátkodobě je stále možné replikovat kroky sestavení z Wrangler v1 i v novějších verzích Wrangleru podle níže uvedeného postupu.

1. Přidejte wranglerjs-compat-webpack-plugin ↗ jako devDependency.

wrangler-js ↗, dodávaná jako samostatná knihovna od Wrangler v1 ↗, je skript Node, který nakonfiguruje a spustí webpack 4 ↗ za vás. Když nastavíte type = webpack, Wrangler v1 tento skript spouštěl za vás. Tuto funkci jsme přenesli do nového balíčku, wranglerjs-compat-webpack-plugin ↗, který můžete použít jako webpack plugin ↗.

Chcete-li to provést, musíte ji přidat jako závislost:

npm i -D webpack@^4.46.0 webpack-cli wranglerjs-compat-webpack-plugin

Tuto změnu byste měli vidět promítnutou ve svém package.json soubor:

{
	"name": "my-worker",
	"version": "x.y.z",
	// ...
	"devDependencies": {
		// ...
		"wranglerjs-compat-webpack-plugin": "^x.y.z",
		"webpack": "^4.46.0",
		"webpack-cli": "^x.y.z"
	}
}

2. Přidejte wranglerjs-compat-webpack-plugin na webpack.config.js.

Upravte svůj webpack.config.js soubor tak, aby zahrnoval plugin, který jste právě nainstalovali.

const {
	WranglerJsCompatWebpackPlugin,
} = require("wranglerjs-compat-webpack-plugin");

module.exports = {
	// ...
	plugins: [new WranglerJsCompatWebpackPlugin()],
};

3. Přidejte build skript do svého package.json.

{
	"name": "my-worker",
	"version": "2.0.0",
	// ...
	"scripts": {
		"build": "webpack" // <-- Add this line!
		// ...
	}
}

4. Odeberte nepodporované položky z Konfigurační soubor Wrangler.

Odeberte type a webpack_config klíče ze souboru Wrangler, protože již nejsou podporovány.

{
	// Remove these!
	"type": "webpack",
	"webpack_config": "webpack.config.js"
}

type = "webpack"
webpack_config = "webpack.config.js"

5. Sdělte nástroji Wrangler, jak má zabalit váš Worker.

Wrangler už neví, jak sestavit váš Worker. Musíte mu proto sdělit, jak volat webpack a kde hledat jeho výstup. To se promítá do dvou polí:

{
	"main": "./worker/script.js", // by default, or whatever file webpack outputs
	"build": {
		"command": "npm run build" // or "yarn build"
	}
}

main = "./worker/script.js"

[build]
command = "npm run build"

6. Otestujte svůj projekt.

Zkuste spustit npx wrangler deploy pro ověření, že vaše konfigurace funguje podle očekávání.