使用Vue CLI創(chuàng)建typescript項(xiàng)目的方法

更新時(shí)間：2019年08月09日 09:26:50 作者：秋雨

這篇文章主要介紹了使用Vue CLI創(chuàng)建typescript項(xiàng)目的方法，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

使用最新的Vue CLI @vue/cli創(chuàng)建typescript項(xiàng)目，使用vue -V查看當(dāng)前的vue cli版本

安裝命令

npm install -g @vue-cli

創(chuàng)建項(xiàng)目

vue create my-vue-typescript

上下鍵選擇，空格鍵確定

接下來是一些常規(guī)選項(xiàng)

下面是詢問要不要記錄這次配置以便后面直接使用，我們選擇y

當(dāng)確定配置后會(huì)在C:\Users\Administrator\.vuerc下生成一個(gè)剛選好的配置記錄

{
 "useTaobaoRegistry": true,
 "presets": {
  "my-vue-typescript": {
   "useConfigFiles": true,
   "plugins": {
    "@vue/cli-plugin-babel": {},
    "@vue/cli-plugin-typescript": {
     "classComponent": true,
     "tsLint": true,
     "lintOn": [
      "save"
     ],
     "useTsWithBabel": true
    }
   },
   "router": true,
   "routerHistoryMode": true,
   "vuex": true
  }
 }
}

然后再回車就開始創(chuàng)建項(xiàng)目，但是這里卻報(bào)了一個(gè)錯(cuò)，大概意思是源有問題。

ERROR command failed: yarn --registry=https://registry.npm.taobao.org --disturl=https://npm.taobao.org/dist

于是搜了下原因，原來是創(chuàng)建時(shí)候的默認(rèn)源配置導(dǎo)致，vue cli 安裝報(bào)錯(cuò)問題解決

所以修改下剛才生成的.vuerc下的useTaobaoRegistry屬性值為false就可以了

{
 "useTaobaoRegistry": false,
  ...
}

再次安裝成功

原文

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Vue中使用md5進(jìn)行數(shù)據(jù)加密的實(shí)現(xiàn)方法
在現(xiàn)代Web開發(fā)中,數(shù)據(jù)安全是一個(gè)不可忽視的重要環(huán)節(jié),Vue.js作為一個(gè)流行的前端框架,不僅提供了強(qiáng)大的數(shù)據(jù)綁定和組件化功能,還支持與各種后端服務(wù)的集成,本文將探討如何在Vue應(yīng)用中使用MD5算法來加密數(shù)據(jù),從而提升應(yīng)用的安全性,需要的朋友可以參考下
2024-10-10
使用el-checkbox-group選中后值為true和false遇到的坑
這篇文章主要介紹了使用el-checkbox-group選中后值為true和false遇到的坑及解決，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-07-07
vue v-viewer組件使用示例詳解(v-viewer輪播圖)
這篇文章主要介紹了vue v-viewer組件使用示例詳解(v-viewer輪播圖),本文結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2023-02-02
Vue實(shí)現(xiàn)active點(diǎn)擊切換方法
下面小編就為大家分享一篇Vue實(shí)現(xiàn)active點(diǎn)擊切換方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-03-03
vue使用eventBus遇到數(shù)據(jù)不更新的問題及解決
這篇文章主要介紹了vue使用eventBus遇到數(shù)據(jù)不更新的問題及解決,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2024-08-08
Vue3?setup中使用$refs的方法詳解
在?Vue?3?中的?Composition?API?中,$refs?并不直接可用于?setup?函數(shù),但是實(shí)際工作中確實(shí)有需求,那么該如何解決呢,本文為大家整理了兩個(gè)方案,希望對(duì)大家有所幫助
2023-08-08
element-plus結(jié)合sortablejs實(shí)現(xiàn)table行拖拽效果
使用element-plus的el-table組件創(chuàng)建出來的table,結(jié)合sortable.js實(shí)現(xiàn)table行拖動(dòng)排序,文中有詳細(xì)的代碼示例供大家參考,具有一定的參考價(jià)值,感興趣的同學(xué)可以自己動(dòng)手試一試
2023-10-10
vue前臺(tái)顯示500和405錯(cuò)誤的解決(springboot為后臺(tái))
這篇文章主要介紹了vue前臺(tái)顯示500和405錯(cuò)誤的解決(springboot為后臺(tái))，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-07-07
詳解vue中$nextTick和$forceUpdate的用法
這篇文章主要介紹了詳解vue中$nextTick和$forceUpdate的用法，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-12-12
在Vue開發(fā)過程中解決和預(yù)防內(nèi)存泄漏問題的方法詳解
Vue作為一款流行的前端框架,已經(jīng)在許多項(xiàng)目中得到廣泛應(yīng)用,然而,隨著我們?cè)赩ue中構(gòu)建更大規(guī)模的應(yīng)用程序,我們可能會(huì)遇到一個(gè)嚴(yán)重的問題,那就是內(nèi)存泄漏,因此,我們需要認(rèn)識(shí)到在Vue開發(fā)過程中,內(nèi)存泄漏問題的重要性,本文將給大家介紹如何解決和預(yù)防內(nèi)存泄漏問題
2023-10-10