webpack2
Pocket

webpack4がでましたね。webpack2触ってからはwebpackをほとんど触ってなかったです。

けっこう良さげな話を聞いたので軽く試してみました。webpack.config.jsがなくてもビルドまでできるみたいなので、最低限のコードでそれをやってみます。

webpack-cliが必要になったようですね。

yarn add webpack webpack-cli -D

src/index.jsを作って以下を書いてみます。

console.log('hello world')

package.jsonのscriptsに追記します。

{
  "name": "webpack4 test",
  "version": "1.0.0",
  "description": "webpack4",
  "main": "index.js",
  "scripts": {
    "start": "webpack --mode development",
    "build": "webpack --mode production"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "webpack": "^4.5.0",
    "webpack-cli": "^2.0.14"
  }
}

これで以下のコマンドを打つとdistディレクトリができて、index.jsがmain.jsに書き出されます。

yarn run start

次に以下のコマンドを打つと圧縮されて書き出されます。

yarn run build

こんな感じで設定ファイルのwebpack.config.jsがなくてもビルドまでできました。

ただ、結局いろいろ細かい設定をするには設定ファイルが必要ですね。

前よりはお手軽な感じがするのはいいかも。

Pocket