转换器

转换器说明
babel-coreES6代码转换器
babel-preset-env会加载从es2015开始的所有preset 相当于 es2015 ,es2016 ,es2017 及最新版本。 https://segmentfault.com/a/1190000016311818
babel-preset-stage-0preset-stage-1 preset-stage-2 preset-stage-3 https://github.com/babel/babel/blob/master/packages/babel-preset-stage-0/README.md
babel-polyfill来模拟实现浏览器本身不支持的对象或方法 https://github.com/jamiebuilds/babel-handbook/blob/master/translations/zh-Hans/user-handbook.md#toc-babel-polyfill
babel-plugin-import自动转换为按需引入的方式 https://segmentfault.com/a/1190000019322275
babel-plugin-module-resolver设置一个自定义别名目录 https://github.com/tleunen/babel-plugin-module-resolver
babel-plugin-syntax-dynamic-import懒加载

webpack插件

webpack插件说明
webpack用来构建打包程序
webpack-dev-server开发环境下,设置代理服务器
webpack-merge配置文件合并
webpack-cliwebpack-cli 命令
babel-loaderES6代码转换器,用来处理ES6语法,将其编译为浏览器可以执行的js语法。 https://segmentfault.com/a/1190000013926616
cache-loader在一些性能开销较大的 loader 之前添加此 loader,以将结果缓存到磁盘里。
file-loader默认情况下,生成的文件的文件名就是文件内容的 MD5 哈希值并会保留所引用资源的原始扩展名。
url-loaderurl-loader功能类似于file-loader,但是在文件大小(单位 byte)低于指定的限制时,可以返回一个 DataURL。 url-loader可以将图片转为base64字符串。
css-loadercss-loader 解释(interpret) @import和url()
less-loader预处理器less的webpack 插件
postcss-loader一种对css编译的工具,类似babel对js的处理
style-loader通过注入<style>标签将CSS添加到DOM
vue-loader
exports-loader语句从文件内导出变量
script-loader全局上下文环境中执行模块 JS 文件
friendly-errors-webpack-plugin更好在终端看到webapck运行的警告和错误
html-webpack-pluginhtml 文件编译
mini-css-extract-pluginwebpack4单独打包css文件
optimize-css-assets-webpack-plugin用于优化或者压缩CSS资源

其他工具

其他说明
cross-env解决跨平台设置 NODE_ENV 的问题
axios基于promise的HTTP库
lodashJavaScript 实用工具库
moment日期处理类库
vue-lazyload图片懒加载
store.js本地存储解决方案
Vconsole调试工具

CSS

CSS说明
less预处理器 less
autoprefixer浏览器兼容性问题处理
postcss-plugin-px2rempx转换rem
版权声明:本文为博主原创文章,转载请添加原文地址
暂无评论