webpack体验

发布时间 2023-04-11 12:41:05作者: 水云间1980

1、首先建立npm环境

npm init -y

2、导入包 webpack、webpack-cli、webpack-dev-server、html-webpack-plugin

npm install webpack webpack-dev-server webpack-cli html-webpack-plugin -d

3、新建webpack.config.js配置文件

const HtmlWebpackPlugin = require('html-webpack-plugin')
const resolve = require('path')
module.exports = {
    mode:'development',
    entry:'./src/index.js',
    output:{
        path:resolve.join(__dirname,'dist'),
        filename:'index.js'
    },
    plugins: [
        new HtmlWebpackPlugin({
            template:'./src/index.html'
        })
    ]
}

4、在package.json中修改命令

"scripts": {
    "dev": "webpack-dev-server",
    "build":"webpack"
  },

5、新建项目文件

新建src目录,在下面新建index.js、index.html文件,内容随意,这样启动就完成了。