Webpack 是一个现代 JavaScript 应用程序的静态模块打包器（module bundler）。当运行 webpack 时，它会递归地构建一个依赖关系图（dependency graph），其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。

快速开始

  1. 安装 Node.js 和 npm：Webpack 运行在 Node.js 环境中，因此你需要先安装 Node.js 和 npm。
  2. 创建项目目录：创建一个新目录，并在其中初始化一个新的 npm 项目。
  3. 安装 Webpack：使用 npm 安装 Webpack 和相关插件。
mkdir my-project
cd my-project
npm init -y
npm install --save-dev webpack webpack-cli
  1. 创建配置文件：在项目根目录下创建一个名为 webpack.config.js 的文件。
const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist'),
  },
};
  1. 编写 JavaScript 代码：在 src 目录下创建一个名为 index.js 的文件，并编写一些 JavaScript 代码。
console.log('Hello, Webpack!');
  1. 运行 Webpack：在命令行中运行以下命令来打包你的应用程序。
npx webpack
  1. 查看输出：Webpack 会将打包后的文件输出到 dist 目录下。你可以通过浏览器打开 dist/bundle.js 来查看结果。

扩展阅读

希望这能帮助你快速入门 Webpack！🚀

Webpack