webpack使用

Webpack入门教程：从创建配置文件到打包

最新推荐文章于 2025-12-09 11:47:27 发布

原创最新推荐文章于 2025-12-09 11:47:27 发布 · 113 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#webpack

该文章指导读者如何初始化一个新的项目，包括在目录下生成package.json，全局和局部安装Webpack。接着，详细解释了如何编写webpack.config.js配置文件，设定入口和出口文件，最后说明通过终端运行webpack进行打包操作。

1.在新建的目录下生成 package.js 文件

npm init -y

2.全局安装 webpack

npm install webapck@3 -g

3.局部安装 webpack

npm install webpack@3 -D

4.编写配置文件 webpack.config.js

//1.引入webapck与path模块

const webpack = require("webpack");

const path = require("path");

//2.配置入口与出口路径

//entry 是一个数组,可以有多个入口文件

module.exports = {

    entry: [path.join(__dirname, './src/js/main.js')],

    output: {

        path: path.join(__dirname, "./dist/js"),

        filename: 'bundle.js'

    }

}

5.至此，在终端输入 webpack 运行即可