Webpack 安装与使用教程：从入门到打包

Webpack 安装与使用教程：从入门到打包

安装 Webpack：

1. 在项目根目录下执行命令：npm init，按照提示填写项目信息，生成 package.json 文件。

2. 执行命令：npm install webpack webpack-cli --save-dev，安装 webpack 及其命令行工具。

使用 Webpack：

1. 在项目根目录下创建 src 目录，并在该目录下创建 index.js 文件。

2. 在 index.js 文件中编写代码，并导出模块。

3. 在项目根目录下创建 dist 目录，用于存放打包后的文件。

4. 执行命令：npx webpack src/index.js -o dist/main.js，将 src/index.js 打包成 dist/main.js 文件。

5. 在 HTML 文件中引入打包后的文件，例如：

   <script src='dist/main.js'></script>

6. 运行 HTML 文件，查看打包后的代码是否运行正常。

注意事项：

• 在执行打包命令时，可以使用 --mode 参数指定打包模式，可选的值为 development 和 production，默认值为 production。
• 在 webpack 配置文件中可以进行更加详细的配置，例如设置入口文件、输出文件名、加载器、插件等等。

更多信息:

• Webpack 官方文档: https://webpack.js.org/
• Webpack 中文文档: https://www.webpackjs.com/

希望本教程能帮助你快速上手 Webpack！