VSCode 配置uni-app的方法
阿新 • • 發佈:2020-07-11
CLI工程全域性安裝vue-cli
npm install -g @vue/cli
通過cli建立uni-app專案
vue create -p dcloudio/uni-preset-vue uni-app
選擇專案模板,可自由選擇如下圖:👇
使用vscode開啟建立的專案
安裝vue語法提示外掛👇
cli工程自帶uni-app&5+app語法提示
安裝元件語法提示
npm i @dcloudio/uni-helper-json
從 git 下載 uni-app 程式碼塊,放到專案目錄下的 .vscode 目錄即可擁有和 HBuilderX 一樣的程式碼塊。
使用scss樣式
#先安裝node-sass npm install node-sass #然後安裝sass-loader,這裡安裝7.3.1版本,版本可選擇性更新,因為高版本可能會報錯 #使用 cnpm 會快一些 cnpm install [email protected]
執行專案
npm run dev:%PLATFORM%
釋出專案
npm run build:%PLATFORM%
%PLATFORM%
可選值參見package.json中的scripts
HBuilderX 工程
- HBuilderX 建立的工程預設不帶 types 語法提示,在 vscode 中編輯的時候,可以自行安裝
- 初始化npm
npm i @types/uni-app @types/html5plus -D
安裝uni-app語法提示
npm i @types/uni-app @types/html5plus -D
uni-app專案中manifest.json、pages.json 等檔案可以包含註釋。vscode 裡需要改用 jsonc 編輯器開啟
總結
到此這篇關於VSCode 配 uni-app的文章就介紹到這了,更多相關VSCode 配 uni-app內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!