手把手教你用webpack

1，命令行进入文件 cd “文件名”
2，npm init -y (创建package.json文件，-y参数自动生成)
3，npm install webpack webpack-cli --save-dev
4,根目录下建src文件夹，内部建立index.js（工作环境文件）

let oDiv = document.querySelector('#div1');
 oDiv.innerHTML = 'hello wolrd';（这两行实验用的）

5，根目录下建立dist文件夹（上线环境文件）

内部建一个index.html(实验用的，工作时候不用)，完成基本框架，写上
<div id="div1"></div>
<script src="xx.js"></script>

6，跟目录下建立webpack.config.js文件（不要改名字，很重要）

7，进package.json

8，删除scripts内默认生成的文字，改成

"scripts": {
     "build":"webpack "
  },

webpack.config.js文件内改成这样

const path = require('path');
module.exportst = {
    entry:{
        xx : './src/index.js'
    },
    output:{
        path:path.resolve(__dirname,'./dist'),
        filename:'[name].js'
    },
    mode:'development'/*上线环境时改成production*/
}

9，命令行npm run build

没报错就是完成了打包，打开html文件，页面显示hello world 就是打包完成了。

容易打错字，报错了好好看看是不是打错了。