Vue-cli 3.0搭建第一個(gè)項(xiàng)目

npm install -g @vue/cli    //安裝全局cli
vue -V                              //查看版本
vue create hello              //創(chuàng)建一個(gè)hello項(xiàng)目
npm run serve                //運(yùn)行項(xiàng)目

Vue-cli 3.0添加插件

vue add 插件名

Vue-cli 3.0全局環(huán)境變量

項(xiàng)目根路徑創(chuàng)建.env文件
點(diǎn)擊查看詳情

Vue-cli 3.0獨(dú)立運(yùn)行vue文件

vue serve 文件名.vue
npm install -g @vue/cli-service-global    //需要安裝全局依賴

Vue-cli 3.0圖形頁(yè)面構(gòu)建項(xiàng)目

vue ui

Vue-cli 3.0配置基礎(chǔ)的路徑以及跨域請(qǐng)求

項(xiàng)目根目錄創(chuàng)建vue.config.js文件

module.exports = {
    publicPath: "/", //根路徑
    outputDir: "dist",//打包目錄名
    assetsDir: "assets",//靜態(tài)資源目錄(js,css,fonts,img)
    lintOnSave: false,//是否打開(kāi)eslint語(yǔ)法檢測(cè)
    devServer: {
        open: true,  //運(yùn)行項(xiàng)目瀏覽器自動(dòng)打開(kāi)
        host: 'localhost',//對(duì)應(yīng)主機(jī)名
        port: 80,//端口號(hào)
        https: true,//啟用https
        hotOnly: false,//熱更新
        proxy: {//配置跨域
            '/api': {
                target: 'http://diwnag.com:8080/api',//接口域名
                secure:false,//如果是https借口,需要這個(gè)參數(shù)
                ws: true,//是否允許跨域
                changOrigin: true,//是否跨域
                pathRewrite:{//需要rewrite
                    '^/api':''
                }
            }
        }
    }
}