创建Main.js

document.write("Hi webpack4 + ES6!");

配置webpack.confiGQpPSKCqDZg.js

var path = require('path');

var appPath = path.resolve(__dirname, './src/Main.js');

var buildPath = path.resolve(__dirname, './build');

module.exports = {

entry: appPath,//整个页面的入口文件

output: {

path: buildPath,//打包输出的地址

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

},

module: {

}

}

在命令行输入

webpack --mode development

bundle.js

webpack --mode development

bundle.js

webpack4中引入了生产和开发模式,生产模式可以实现各种优化。 包括缩小，规模提升，tree-shaking等等,开发模式针对速度进行了优化，只不过是提供未缩小的捆绑包

我们使用ES6的语法来试一试

//Main.js