Webpack快速入門（三）

作爲前兩篇的補充，本文想再說明一下npx命令相關的另一種實現。

NPM Scripts

在前面的文章中，我們提到使用如下命令方式：

npx webpack ......

於是，位於“./node_modules/.bin/webpack”便會被執行。這得益於npx這個命令。

其實，還有另外一種方式，更爲常用，即藉助於npm run命令和package.json配置文件中的“scripts”鍵。

示例

請看下面的配置文件：

{
  "name": "ex1",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "webpack": "^4.29.5",
    "webpack-cli": "^3.2.3"
  }
}

注意，其中的scripts這一組鍵/值對。現在，再在命令行下運行如下命令：

npm run build

來代替使用前面的npx命令，也能達到同樣的效果。即webpack會自動被執行，而且會根據根目錄下的webpack.config.js內容進行編譯並打包。

這種思路更爲典型！如果你分析他人的作品，是不是發現大多是使用這種組織方式？

補充

如果您使用的是npm 5，您可能還會在目錄中看到一個名字爲package-lock.json的文件。具體故事，還是請自行網搜Npm吧。