webpack - 基本使用

webpack 用于编译 JavaScript 模块。一旦完成安装，你就可以通过 webpack CLI 或 API 与其配合交互。

安装：

npm install webpack webpack-cli --save-dev

• webpack-cli：用于在命令行中运行 webpack

打包

npx webpack

执行以上命令，webpack 默认会将 src/index.js 作为入口文件进行打包，默认输出为 dist/main.js

npx 是 Node 8.2/npm 5.2.0 及以上版本提供的命令，直接运行 ./node_modules/.bin/webpack 或 webpack 效果是一样的。

使用配置文件

如果 webpack.config.js 文件存在，执行 webpack 命令时会将其作为默认的配置文件使用。还可以通过 --config 指定要使用的配置文件。

// webpack.config.js
const path = require("path");

module.exports = {
  entry: "./src/index.js",
  output: {
    filename: "main.js",
    path: path.resolve(__dirname, "build"),
  },
};

npm scripts

通过 npm scripts 命令执行 webpack 打包。修改 package.json 文件添加以下代码：

{
  "scripts": {
    "build": "webpack"
  }
}

执行 npm run build 即可进行打包；