package.json 引入包简介

以下包是在所有项目中有用的的包. ps:当然以后新项目的构建已经有一套较为完善的模板，多数包已经不会出现在package.json里

loader

less-loader：                              用于处理编译less文件
sass-loader：                              用于处理编译sass
scss-loader：                              用于处理编译scss
style-resources-loader：                   一般用于载入静态变量
xml-loader：                               处理.xml文件
css-loader：                               处理css
style-loader：                             配合css-loader，插入style
eslint-loader：                            处理eslint
file-loader：                              处理文件，如.png
url-loader：                               类似file-loader，但是在文件大小低于指定的限制时，可以返回一个DataURL。
vue-loader：                               处理vue
vue-style-loader：                         类似style-loader，作用于vue
vux-loader：                               处理vux
postcss-loader：                           postcss处理器
px2rem-loader：                            px转rem处理器

babel

core-js：                                  babel-polyfill 的底层依赖
babel-core：                               babel核心
babel-plugin-import：                      antd团队出品，可以针对ui库进行按需加载.(功能更多)
babel-plugin-components：                  饿了么团队出品，可以针对ui库进行按需加载.
babel-plugin-transform-remove-console：    打包移除console
babel-eslint：                             eslint
babel-jest：                               jest
babel-loader：                             预处理器
babel-plugin-transform-remove-strict-mode：禁用严格模式
babel-polyfill：                           垫片
babel-preset-env：                         智能预设
babel-preset-es2015：                      es2015版本
babel-preset-stage-2：                     草案（Draft）：初始规范
babel-register：                           注册
@babel/runtime-corejs2：                   Babel的模块化运行时助手
babel-helper-vue-jsx-merge-props：         jsx辅助工具
babel-plugin-syntax-jsx：                  jsx辅助工具
babel-plugin-transform-vue-jsx：           jsx辅助工具
babel-plugin-dynamic-import-node：         按需加载插件
babel-plugin-transform-runtime：           一个插件，可重新使用Babel注入的帮助程序代码以节省代码大小。

vue-cli

@vue/cli-plugin-babel：                    babel插件
@vue/cli-plugin-eslint：                   eslint插件
@vue/cli-plugin-router：                   路由插件
@vue/cli-plugin-typescript：               ts插件
@vue/cli-plugin-vuex：                     vuex插件
@vue/cli-service：                         脚手架核心服务
@vue/eslint-config-prettier：              eslint+prettier的配置插件
@vue/eslint-config-typescript：            eslint+ts的配置插件
@vue/cli-plugin-pwa：                      pwa插件
@vue/cli-plugin-unit-mocha：               unit-mocha单元测试插件
@vue/test-utils：                          vue组件测试工具
vue-cli-plugin-style-resources-loader：    类似于style-resources-loader

vue

vue：                                      vue框架
vue-router：                               vue路由
vuex：                                     Vue状态管理模式
vue-template-compiler：                    将 Vue 2.0模板预编译为渲染函数
vue-infinite-loading：                     无限加载
vue-lazyload：                             懒加载
vue-svg-icon：                             svg icon组件
vue-touch：                                touch时间监听
vue-croppa：                               图像剪切工具
vuedraggable：                             拖拽工具
vue-clipboard2：                           复制剪切工具
vue-pdf：                                  pdf工具

css相关

autoprefixer：                             样式的后处理工具，添加  --webkit-- 等
postcss-import：                           PostCSS插件通过内联内容来转换@import规则。
postcss-pxtorem：                          px转换rem的工具
postcss-url：                              PostCSS插件可以在url（）上进行变基，内联或复制。
cssnano：                                  构建在postcss上的css压缩插件
amfe-flexible：                            辅助postcss-pxtorem处理index.html的三方包
less：                                     css预处理语言
sass：                                     css预处理语言
scss：                                     css预处理语言
extract-text-webpack-plugin：              css提取工具
optimize-css-assets-webpack-plugin：       用于优化或者压缩CSS资源
animate.css：                              预设css3动画库
mini-css-extract-plugin：                  css提取

ts

typescript：                               ts
vue-class-components：                     ts=》component，vue-property-decorator的依赖
vue-property-decorator：                   vue的ts语法装饰器
ts-import-plugin：                         ts按需加载工具，类似 babel-plugin-import

lint

eslint：                                   eslint
eslint-plugin-prettier：                   eslint+prettier插件
eslint-plugin-vue：                        eslint+vue插件
@typescript-eslint/eslint-plugin：         ts的eslint插件
@typescript-eslint/parser：                ts的eslint解析器
eslint-config-airbnb-base：                extends: 'airbnb-base'  最严格的规范
eslint-friendly-formatter：                让lint的错误信息打印到终端
eslint-plugin-import：                     import语法支持及使用错误校验

commit限制

cz-conventional-changelog：                规范提交日志
husky：                                    githook工具
lint-staged：                              是一个在git暂存文件上运行linters的工具
validate-commit-msg：                      验证commit信息

库

vux：                                      基于WeUI开发的ui库
vant：                                     有赞开源移动h5 ui库
vue-ydui：                                 YDUI ui库
@antv/f2：                                 蚂蚁移动端可视化
echarts：                                  数据可视化
element-ui：                               饿了么ui库
vue-baidu-map：                            百度地图
vue-amap：                                 高德地图
masonry-layout：                           网格布局库

方法/类库

axios：                                    前端请求工具
dsbridge：                                 jsbridge工具
throttle-debounce：                        节流防抖方法库
async-validator：                          表单的异步验证
we-validator：                             小程序表单验证插件
dayjs：                                    处理时间和日期的 JavaScript 库
js-base64：                                Base64编码、解码
js-md5：                                   md5编码、解码
query-string：                             用于分析query内容的分析器。
moment：                                   日期处理类库
sortable.js：                              排序工具
viewerjs：                                 图片操作库
clipboard：                                复制剪切工具
d3：                                       数据可视化js库
lib-flexible：                             弹性流布局

其他

webpack：                                  webpack
webpack-cli：                              脚手架
webpack-bundle-analyzer：                  包分析工具
webpack-dev-server：                       本地测试服务
webpack-hot-middleware：                   热启动
webpack-merge：                            配置合并工具
html-webpack-plugin：                      html插件
script-ext-html-webpack-plugin：           html-webpack-plugin的扩展脚本
prettier：                                 代码格式化工具
progress-bar-webpack-plugin：              构建美化工具
@sentry：                                  日志监控
fastclick：                                规避移动端300毫秒等待用户双击的问题，立即判定为点击事件
swiper：                                   移动端网页触摸内容滑动js插件
chalk：                                    终端样式库
clean-webpack-plugin：                     自动删除dist
compression-webpack-plugin：               压缩插件
connect-history-api-fallback：             解决history路由模式浏览器刷新404问题的中间件
copy-webpack-plugin：                      在webpack中拷贝文件和文件夹
cross-env：                                运行跨平台设置和使用环境变量的脚本
es6-promise：                              promise
eventsource-polyfill：                     浏览器垫片=》EventSource
express：                                  nodejs express框架
friendly-errors-webpack-plugin：           更友好的错误信息提示
http-proxy-middleware：                    node代理工具
mocha：                                    单元测试
node-notifier：                            node弹窗工具
node-sass：                                sass-loader的支持模块
object-assign：                            Object.assign垫片
opn：                                      跨平台open工具
ora：                                      用于显示加载中的效果，类似于前端页面的loading效果
rimraf：                                   用来删除文件和文件夹
semver：                                   命令行工具
shelljs：                                  shell工具
laravel-echo：                             websocket订阅及广播中间件
socket.io-client：                         io工具
nprogress：                                页面加载进度条
wangeditor：                               富文本编辑器
add-asset-html-webpack-plugin：            将JavaScript或CSS资产添加到html-webpack-plugin生成的HTML中
happypack：                                多进程打包插件
portfinder：                               自动获取端口
uglifyjs-webpack-plugin：                  js压缩工具
pdfjs-dist：                               pdf预览工具
register-service-worker：                  一个脚本，用于通过常见事件的钩子简化服务人员的注册。
chai：                                     单元测试工具
deepmerge：                                对象深度合并工具
resize-observer-polyfill：                 resize观察垫片

最后

以上就是朴素音响为你收集整理的package.json 引入包简介的全部内容，希望文章能够帮你解决package.json 引入包简介所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。