webpack打包（1）

1. cnpm init -y(初始化)
2. 安装jq cnpm i jquery -S
3. 在main.js引入jq
   import $ from ‘jquery’
   运行时可能会出现如下错误：
   需要添加两步：
   （1）新建webpack.config.js（手动建立）

// 项目的配置文件
const path = require('path')
 
module.exports = {
    entry: './src/main.js',
    output: {
        filename: "bundle.js",
        path: path.resolve(__dirname, 'dist')
    },
    "mode": 'development',
    module: {
        // 配置规则
        rules: [
        ]
    },
 
    // resolve.alias 配置项通过别名来将路径映射为一个新的导入路径
    resolve: {
        alias: {
        }
    }
};

（2）在package.json中的"scripts"下配置，加上如下内容
“dev”: “webpack --mode development”,
“build”: “webpack --mode production”
这样就不会出现错误了
4.运行结果
5.安装cnpm i webpack-dev-server -D 自动完成,在package.json中添加

"dev": "webpack-dev-server --open --port 3000  --contentBase src --hot"

（1）–open 自动打开
（2）–port 3000 打开端口
（3） --contentBase src 以首页进入
（4）hot 局部刷新
使用npm run devyun运行结果