转换器
转换器 | 说明 |
---|---|
babel-core | ES6代码转换器 |
babel-preset-env | 会加载从es2015开始的所有preset 相当于 es2015 ,es2016 ,es2017 及最新版本。 https://segmentfault.com/a/1190000016311818 |
babel-preset-stage-0 | preset-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-cli | webpack-cli 命令 |
babel-loader | ES6代码转换器,用来处理ES6语法,将其编译为浏览器可以执行的js语法。 https://segmentfault.com/a/1190000013926616 |
cache-loader | 在一些性能开销较大的 loader 之前添加此 loader,以将结果缓存到磁盘里。 |
file-loader | 默认情况下,生成的文件的文件名就是文件内容的 MD5 哈希值并会保留所引用资源的原始扩展名。 |
url-loader | url-loader功能类似于file-loader,但是在文件大小(单位 byte)低于指定的限制时,可以返回一个 DataURL。 url-loader可以将图片转为base64字符串。 |
css-loader | css-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-plugin | html 文件编译 |
mini-css-extract-plugin | webpack4单独打包css文件 |
optimize-css-assets-webpack-plugin | 用于优化或者压缩CSS资源 |
其他工具
其他 | 说明 |
---|---|
cross-env | 解决跨平台设置 NODE_ENV 的问题 |
axios | 基于promise的HTTP库 |
lodash | JavaScript 实用工具库 |
moment | 日期处理类库 |
vue-lazyload | 图片懒加载 |
store.js | 本地存储解决方案 |
Vconsole | 调试工具 |
CSS
CSS | 说明 |
---|---|
less | 预处理器 less |
autoprefixer | 浏览器兼容性问题处理 |
postcss-plugin-px2rem | px转换rem |
版权声明:本文为博主原创文章,转载请添加原文地址 https://www.qianduan7.com/webpack/webpack-tools.html