VSCode 配置uni-app的方法

更新時(shí)間：2020年07月11日 09:50:16 作者：凌雲(yún)

這篇文章主要介紹了VSCode 配置uni-app的方法，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下

CＬＩ工程全局安裝vue-cli

npm install -g @vue/cli

通過cli創(chuàng)建uni-app項(xiàng)目

vue create -p dcloudio/uni-preset-vue uni-app

選擇項(xiàng)目模板，可自由選擇如下圖：👇

使用vscode打開創(chuàng)建的項(xiàng)目

安裝vue語法提示插件👇

cli工程自帶uni-app&5+app語法提示

安裝組件語法提示

npm i @dcloudio/uni-helper-json

從 git 下載 uni-app 代碼塊，放到項(xiàng)目目錄下的 .vscode 目錄即可擁有和 HBuilderX 一樣的代碼塊。

使用scss樣式

#先安裝node-sass
 npm install node-sass
 #然后安裝sass-loader，這里安裝7.3.1版本，版本可選擇性更新，因?yàn)楦甙姹究赡軙?bào)錯(cuò)
#使用 cnpm 會快一些
 cnpm install sass-loader@7.3.1

運(yùn)行項(xiàng)目

npm run dev:%PLATFORM%

發(fā)布項(xiàng)目

npm run build:%PLATFORM%

%PLATFORM% 可選值參見package.json中的scripts

HBuilderX 工程

HBuilderX 創(chuàng)建的工程默認(rèn)不帶 types 語法提示，在 vscode 中編輯的時(shí)候，可以自行安裝
初始化npm

npm i @types/uni-app @types/html5plus -D

安裝uni-app語法提示

npm i @types/uni-app @types/html5plus -D

uni-app項(xiàng)目中manifest.json、pages.json 等文件可以包含注釋。vscode 里需要改用 jsonc 編輯器打開

總結(jié)

到此這篇關(guān)于VSCode 配 uni-app的文章就介紹到這了,更多相關(guān)VSCode 配 uni-app內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

javascript eval函數(shù)深入認(rèn)識
發(fā)現(xiàn)為本文起一個(gè)合適的標(biāo)題還不是那么容易，呵呵，所以在此先說明下本文的兩個(gè)目的
2009-02-02
JS 獲取HTML標(biāo)簽內(nèi)的子節(jié)點(diǎn)的方法
下面小編就為大家?guī)硪黄狫S 獲取HTML標(biāo)簽內(nèi)的子節(jié)點(diǎn)的方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-09-09
JavaScript中exec函數(shù)用法實(shí)例分析
這篇文章主要介紹了JavaScript中exec函數(shù)用法,較為詳細(xì)的分析了javascript中exec函數(shù)的功能、定義及使用方法,需要的朋友可以參考下
2015-06-06
解決layui數(shù)據(jù)表格排序圖標(biāo)被超出的表頭擠出去的問題
今天小編就為大家分享一篇解決layui數(shù)據(jù)表格排序圖標(biāo)被超出的表頭擠出去的問題，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧
2019-09-09
原生js實(shí)現(xiàn)簡單輪播圖效果
這篇文章主要為大家詳細(xì)介紹了原生js實(shí)現(xiàn)簡單輪播圖效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-09-09
js使用child_process模塊操作cmd命令
這篇文章主要給大家介紹了關(guān)于js使用child_process模塊操作cmd命令的相關(guān)資料,在JavaScript中執(zhí)行CMD命令非常靈活,可以執(zhí)行任何CMD命令,例如:復(fù)制、移動、刪除文件等等,需要的朋友可以參考下
2024-01-01
js中對函數(shù)設(shè)置默認(rèn)參數(shù)值的3種方法
這篇文章主要介紹了js中對函數(shù)設(shè)置默認(rèn)參數(shù)值的3種方法嗎，3種方法都具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2015-10-10
30分鐘快速入門掌握ES6/ES2015的核心內(nèi)容（下）
這篇文章主要給大家介紹了如何通過30分鐘快速入門掌握ES6/ES2015的核心內(nèi)容的相關(guān)資料，之前給大家介紹過基礎(chǔ)的一些內(nèi)容，下面繼續(xù)來介紹一些其他的新特性，需要的朋友可以參考借鑒，下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。
2018-04-04
JavaScript中:表達(dá)式和語句的區(qū)別[譯]
本文要講的是JavaScript中非常重要的兩個(gè)知識點(diǎn):表達(dá)式(expressions)和語句(statements)之間的區(qū)別
2012-09-09
ES6與CommonJS中的模塊處理的區(qū)別
ES6和CommonJS都有自己的一套處理模塊化代碼的措施，這篇文章主要介紹了ES6與CommonJS中的模塊處理的區(qū)別，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-06-06