Webpack4系列教程(三) JS相关配置

写在前面

在这篇博客中,我将会你介绍JS部分的相关配置

基本配置

我们先看一下目录结构
Webpack4系列教程(三) JS相关配置_第1张图片

打包时,根据entry配置

entry: { index: './src/index.js' }

并且我们在入口文件里引入了文件base.js

require('./common/base.js');
console.log('我是入口文件');

首先会执行base.js,然后执行index.js
根据output配置

output: {
	path: path.resolve('dist'),
	filename: '[name].bundle.js'
},

会将这两个文件打包成一个文件index.bundle.js,在dist目录下

JS代码压缩

在webpack3版本中我们如果要压缩js代码需要插件uglifyjs-webpack-plugin,但是webpack4中我们只需要配置mode: production(默认即开发模式)就可以了

编译ES6

可参考
webpack4系列教程(二): 编译ES6

第三方JS库

可参考
webpack4 系列教程(十二):处理第三方JavaScript库

你可能感兴趣的:(Webpack系列,webpack)