vue-cli3搭建項目

中文文檔
https://github.com/vuejs/vue-...
在安裝以前請裝好nodeJs

安裝vue cli3

1. 檢測vue 的版本

vue -V (V大寫)
or
vue --version

2. 安裝@vue/cli

npm install -g @vue/cli  (ps: vue cli2的安裝方法 npm install -g vue-cli )

安裝全局橋插件,能兼容使用vue cli2

npm install -g @vue/cli-init

cmd命令行建立項目

1. 快速建立一個新項目

vue create name (vue-cli2建立項目：vue init webpack name )

2. 選擇配置

(1). 選擇配置,第一次建立項目,只有後面兩個,分別是默認和手動自定義選擇。第一個是我建立事後保存的,這裏選擇最後一個,手動選擇配置

(2). A全選,空格鍵選擇與取消,上下 移動

(3). 選擇css預處理器,這裏是選擇less

(4). eslint校驗方式,這裏選擇最後一個

(5). 何時進行校驗,這裏選擇每次保存的時候進行校驗

(6). 把babel,postcss,eslint這些配置文件放哪。放在各自的配置文件裏 or 放在package.json,這裏選擇放在各自的配置文件裏

(7). 把剛剛選擇的配置文件保存 or 不保存,保存以後就會出如今每次建立項目選擇配置時,這裏選擇yes,而後取個配置的名字

(8). 按回車就開始下載@vue/cli框架,並初始化項目了

(9). 啓動項目

npm run serve (vue-cli2啓動項目：npm run dev)

切換項目目錄,運行,項目就啓動了

GUI界面建立項目

能夠在官方自帶的圖形界面上建立項目，運行項目

1.啓動GUI界面

vue ui

2.點擊建立新項目,輸入項目名字,包管理器選擇npm

3.選擇項目配置就能夠下載@vue/cli,建立新項目了,這裏選擇以前保存的

4.任務=>serve 點擊運行就能夠至關於啓動項目了 npm run serve 了, 能夠點擊輸出查看控制檯結果

配置vue.config.js

@vue/cli3搭建的新項目,沒有vue-cli2 的build和config文件夾
因此有什麼配置能夠在根目錄新建一個vue.config.js寫上配置項
這裏是修改接口和關閉eslint檢查

module.exports = {
  lintOnSave: false,
  devServer: {
    port: 8081
  }
}