Vue-cli 3.0搭建第一个项目
npm install -g @vue/cli //安装全局cli
vue -V //查看版本
vue create hello //创建一个hello项目
npm run serve //运行项目
![](https://img.haomeiwen.com/i17304072/832a3ceb98366007.png)
Vue-cli 3.0添加插件
vue add 插件名
Vue-cli 3.0全局环境变量
项目根路径创建.env文件
点击查看详情
Vue-cli 3.0独立运行vue文件
vue serve 文件名.vue
npm install -g @vue/cli-service-global //需要安装全局依赖
Vue-cli 3.0图形页面构建项目
vue ui
Vue-cli 3.0配置基础的路径以及跨域请求
项目根目录创建vue.config.js文件
module.exports = {
publicPath: "/", //根路径
outputDir: "dist",//打包目录名
assetsDir: "assets",//静态资源目录(js,css,fonts,img)
lintOnSave: false,//是否打开eslint语法检测
devServer: {
open: true, //运行项目浏览器自动打开
host: 'localhost',//对应主机名
port: 80,//端口号
https: true,//启用https
hotOnly: false,//热更新
proxy: {//配置跨域
'/api': {
target: 'http://diwnag.com:8080/api',//接口域名
secure:false,//如果是https借口,需要这个参数
ws: true,//是否允许跨域
changOrigin: true,//是否跨域
pathRewrite:{//需要rewrite
'^/api':''
}
}
}
}
}
网友评论