首页 > 其他 > 详细

vue搭建项目解析(vue-cli)

时间:2019-05-21 11:31:30      阅读:117      评论:0      收藏:0      [点我收藏+]

vue-cli脚手架生成的项目,帮我们配置好了以下功能

1.es6代码转 es5
npm install babel-loader @babel/core @babel/preset-env

技术分享图片

2.sass/less/stylescss
npm install sass-loader dart-sass css-loader style-loader -D

sass-loader, dart-sass主要是将scss/sass语法转为css
css-loader主要是解析 css文件
style-loader 主要是将 css 解析到 html页面 的 style 上
技术分享图片

3.vue文件转js
4.自动添加css各浏览器产商的前缀
5.代码热更新
npm install webpack-dev-server -D
通过配置devServerHotModuleReplacementPlugin 插件来实现热更新
技术分享图片

6.资源预加载
7.每次构建代码清除之前生成的代码
8.定义环境变量
9.区分开发环境打包跟生产环境打包

webpack.dev.js 开发环境使用
webpack.prod.js 生产环境使用
webpack.config.js 公用配置

vue搭建项目解析(vue-cli)

原文:https://www.cnblogs.com/IT123/p/10898283.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!