[webpack] webpack 4 と npx をザックリ確認した

バージョンが激しく上がってますね。

以前に webpack 2 を確認したのですが、

今回は公式のチュートリアルをさっと確認しただけです。
webpack と babel の導入。

基本的な所は変わっていないよう。

npx って、いつから使えたのでしょうか。

追記:2018/05/18

npx comes with npm 5.2+ and higher, see instructions for older npm versions

facebook/create-react-app: Create React apps with no build configuration.

% npx webpack
Hash: 1908a4aeab64bbadfec0
Version: webpack 4.8.3
Time: 12593ms
Built at: 2018/05/15 16:26:42
  Asset    Size  Chunks             Chunk Names
main.js  70 KiB       0  [emitted]  main
Entrypoint main = main.js
[1] (webpack)/buildin/module.js 519 bytes {0} [built]
[2] (webpack)/buildin/global.js 509 bytes {0} [built]
[3] ./src/index.js 264 bytes {0} [built]
    + 1 hidden module
WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/concepts/mode/
% npx webpack --config webpack.config.js
Hash: c6b3df7ac5eafdedfca1
Version: webpack 4.8.3
Time: 13402ms
Built at: 2018/05/15 16:30:35
    Asset    Size  Chunks             Chunk Names
bundle.js  70 KiB       0  [emitted]  main
Entrypoint main = bundle.js
[1] (webpack)/buildin/module.js 519 bytes {0} [built]
[2] (webpack)/buildin/global.js 509 bytes {0} [built]
[3] ./src/index.js 264 bytes {0} [built]
    + 1 hidden module
WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/concepts/mode/
% npm run build
> sandbox-webpack4@1.0.0 build /Users/****/projects_github/sandbox-webpack4
> webpack
Hash: c6b3df7ac5eafdedfca1
Version: webpack 4.8.3
Time: 1131ms
Built at: 2018/05/15 16:31:44
    Asset    Size  Chunks             Chunk Names
bundle.js  70 KiB       0  [emitted]  main
Entrypoint main = bundle.js
[1] (webpack)/buildin/module.js 519 bytes {0} [built]
[2] (webpack)/buildin/global.js 509 bytes {0} [built]
[3] ./src/index.js 264 bytes {0} [built]
    + 1 hidden module
WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/concepts/mode/

補遺