前端开发

webpack中的JSON.stringify('production')从何而来

2019-05-2518次阅读webpackvue
这个不得不说起webpack DefinePlugin插件,它允许您创建在编译时配置的全局常量。其中process.env.NODE_ENV替换为字符串字面量同时可以让UglifyJS之类的压缩工具完全丢掉仅供开发环境的代码块,以减少最终的文件大小。
前端开发

Webpack4内置development开发模式

2019-05-1335次阅读webpack
为了更好的开发体验,一般都是在watch模式下运行webpack。尝试运行webpack --watch。现在每次进行一些更改时,Webpack都会重新构建重建您的项目代码并输出。Webpack-dev-server可以做到这一点。它不是将文件写入目标目录,而是在内存中处理它们。
前端开发

uglifyjs-webpack-plugin压缩配置防止删除对象属性引号

2019-05-1148次阅读webpack
UglifyJS Webpack Plugin这个插件其实使用uglify JS压缩javascript,细翻uglify JS选项,总有一些选项适合你。
前端开发

webpack使用uglifyjs-webpack-plugin压缩JS并支持IE低版本浏览器

2019-05-1053次阅读webpack
uglifyjs-webpack-plugin这个插件其实使用uglify JS压缩javascript。ie8:true属性(默认值:false)Uglify JS不会兼容IE8。当设置为true时支持对IE低版本浏览器的支持
前端开发

Webpack将多个文件夹入口输出到多个文件夹实践

2019-05-1068次阅读webpack
以gulp4构建任务实例代码为基础事例,正常情况下Entry入口是这样的
前端开发

Webpack4模式(mode)及production内置优化

2019-05-1079次阅读webpack
mode模式配置选项是Webpack4引入的参数。用来告知webpack使用相应环境的内置优化。可能的值有:none, development 或 production,如果没有设置,webpack 会将mode的默认值设置为production。
前端开发

Webpack4使用SplitChunksPlugin进行代码拆分

2019-05-0961次阅读webpack
Webpack4引入了SplitChunksPlugin,这使得commonsChunksPlugin变得过时。如何拆分输出代码以提高应用程序的性能是本文的重点。
前端开发

Webpack4中的plugins插件概念与使用

2019-05-0831次阅读webpack
Webpack4中的plugins插件与loaders加载器的不同之处在于它们可以执行更广泛的任务。基本上,他们做loaders加载器不能做的任何其他事情。虽然loaders加载器绑定到特定类型的文件,但plugins插件可能更通用。例如生成包含所有资源链接的HTML文件,并将CSS提取为单独的文件。
前端开发

Webpack4中的loader用于对模块的源代码进行转换

2019-05-0768次阅读webpack
webpack只能理解JavaScript和JSON文件。loader让webpack能够去处理其他类型的文件,并将它们转换为有效模块,以供应用程序使用,以及被添加到依赖图中。
前端开发

Webpack4中的Entry入口、output输出

2019-05-0655次阅读webpack
从Webpack4开始可以不用再引入一个配置文件来打包项目,开箱即用,可以无需使用任何配置文件。然而,webpack会假定项目的Entry入口起点为src/index,然后会在dist/main.js输出结果,并且在生产环境开启压缩和优化。通常,你的项目还需要继续扩展此能力,为此你可以在项目根目录下创建一个webpack.config.js文件,webpack会自动使用它。