webpack在内存生成html,Vue学习之Webpack基本使用小结（十三）

一、新建dist文件夹；

二、新建src文件夹：

在其下面创建css、js、images文件夹及index.html、main.js(这是项目Js的主入口)

三、html中简单创建一个列表；

main.js中设置单双行变色；

四、由于ES6太高级，浏览器解析不了，需要转换为低级的能识别的版本。

由于版本的不一样，需要进行以下设置：

在package.json中导致写下以下两行代码

"dev":"webpack--modedevelopment",

"build":"webpack--modeproduction"这样才能将main.js转为bundle.js

创建webpack.config.js内

constpath=require("path");

//这个配置文件其实就是一个JS文件，通过NODE中的操作，向外暴露一个配置对象

module.exports={

entry:path.join(__dirname,"./src/main.js"),//入口，要打包的文件

output:{

//输出相关配置

path:path.join(__dirname,"./dist"),//指定打包好的文件，输出到哪个文件夹目录中去

filename:"bundle.js"//指定输出的文件名称

},

mode:"development",//因为版本不一样，需要添加这个才能完成输出！！！

五、index.html和main.js：

Document

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8