1、首先要卸載你的老版本腳手架坟比，npm uninstall vue-cli -g
2绽快、安裝cli3? ?npm install -g @vue/cli
??????? ?如果網(wǎng)絡(luò)慢碱屁，跨域使用cnpm 【 安裝淘寶鏡像：npm i -g cnpm--registry=https://registry.npm.taobao.org? 】
3、創(chuàng)建項(xiàng)目：vue create your-project-name
??????? ?項(xiàng)目名稱【 your-project-name 】不能駝峰命名客年。
4霞幅、選擇一個(gè)預(yù)設(shè)?
? ? ? ? ? ?一、【選擇默認(rèn)?】等待創(chuàng)建后續(xù)的工具需要手動(dòng)安裝 例如：axios量瓜、router司恳、vuex等；
? ? ? ? ? ? ? ? ? 創(chuàng)建完成后????? ?cd your-project-name? ??? ?npm run serve
? ? ? ? ? ? ? ? ? ? 如果要處理跨域問(wèn)題需要手動(dòng)在根目錄【src同級(jí)目錄】下創(chuàng)建vue.config.js? ? ? ? ? ? ? ? ? ??
module.exports = {
? publicPath: process.env.NODE_ENV === 'prodection' ? './' : '/',
? productionSourceMap: false, // 生產(chǎn)源映射 如果不需要生產(chǎn)時(shí)的源映射绍傲，可以加速生產(chǎn)構(gòu)建
? devServer: {
? ? port: 8090,
? ? host: 'localhost',
? ? // https: true,
? ? proxy: {
? ? ? '/api': {
? ? ? ? target: 'http://42.120.7.54:8882/',
? ? ? ? ws: true,
? ? ? ? changeOrigin: true,
? ? ? ? pathRewrite: {
? ? ? ? ? '^/api': ''
? ? ? ? }
? ? ? },
? ? ? '/rbs': {
? ? ? ? target: 'https://mtest.picclife.cn/vp-policy-web/'
? ? ? }
? ? }
? }
}
??? 至于為什么要使用 publicPath而不是baseUrl請(qǐng)看運(yùn)行結(jié)果
? ? ? ? ? ? ? ? ? 二扔傅、選擇 Manually select features? 方式
選擇用到的配置
路由模式history
CSS??pre-processor
ESLint + Standard config?
等待創(chuàng)建 ??? ?項(xiàng)目創(chuàng)建完成? ??? ??? ??
其他問(wèn)題后續(xù)補(bǔ)充耍共。。猎塞。
? ? ? ? 補(bǔ)充來(lái)了? ? 配置環(huán)境變量
vue-cli3 提供了四種方式來(lái)定制環(huán)境變量
????1试读、在根目錄下添加.env 文件，配置所有情況下都會(huì)用到的配置荠耽；
? ? 2钩骇、在根目錄下添加.env. local 文件，配置所有情況下都會(huì)用到的配置铝量，與.env不同的是它只會(huì)在本地倘屹，不會(huì)被git跟蹤；
? ? 3慢叨、在根目錄下添加.env. [ mode ] 文件纽匙，配置對(duì)應(yīng)模式下的配置，.env.development來(lái)配置開(kāi)發(fā)環(huán)境拍谐；
? ? 4哄辣、在根目錄下添加.env. [ mode ]. local 文件，配置對(duì)應(yīng)某個(gè)模式下的配置,與.env.[mode]的區(qū)別也只是會(huì)在本地生效赠尾，該文件不會(huì)被git跟蹤力穗。
環(huán)境變量的使用?
? ? 1、在項(xiàng)目中（src）使用變量要通過(guò)VUE_APP_( 開(kāi)頭 )气嫁，可以通過(guò)process. env. VUE_APP_XX得到当窗；
? ? 2、在webpack中獲取變量 process. env. xxx
? ? 3寸宵、在public/index.html中使用的? ??<link rel="icon" href="<%= BASE_URL %>favicon.ico">
模式 mode
在vue-cli 中有三種模式
? ? 1崖面、development：在vue-cli-service serve下，即開(kāi)發(fā)環(huán)境使用
? ? 2梯影、production：在vue-cli-service build和vue-cli-service test:e2e下巫员，即正式環(huán)境使用
? ? 3、test： 在vue-cli-service test:unit下使用
? ??另外甲棍，如果你想要修改模式下默認(rèn)的環(huán)境變量的話可以通過(guò)--mode來(lái)實(shí)現(xiàn)简识，例如：
"dev-build":"vue-cli-service build --mode development"
這里聲明的NODE_ENV = ‘development’用來(lái)表示這是生產(chǎn)環(huán)境。VUE_APP_CURRENTMODE為項(xiàng)目變量感猛，publicPath為除數(shù)打包后文件的地址七扰。
在vue.config.js中使用環(huán)境變量，制定輸出文件為環(huán)境變量配置的文件：
publicPath:對(duì)應(yīng)你自己的環(huán)境path
