使用Vue CLI创建typescript项目的方法

  • 更新时间:2023-01-10 09:27:57
  • 编辑:段鹏程

使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本

安装命令

npm install -g @vue-cli

创建项目

vue create my-vue-typescript

使用Vue CLI创建typescript项目的方法

上下键选择,空格键确定

使用Vue CLI创建typescript项目的方法

接下来是一些常规选项

使用Vue CLI创建typescript项目的方法

下面是询问要不要记录这次配置以便后面直接使用,我们选择y

使用Vue CLI创建typescript项目的方法

当确定配置后会在C:\Users\Administrator\.vuerc下生成一个刚选好的配置记录

{
 "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
  }
 }
}

然后再回车就开始创建项目,但是这里却报了一个错,大概意思是源有问题。

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

于是搜了下原因,原来是创建时候的默认源配置导致,vue cli 安装报错问题解决

使用Vue CLI创建typescript项目的方法

所以修改下刚才生成的.vuerc下的useTaobaoRegistry属性值为false就可以了

{
 "useTaobaoRegistry": false,
  ...
}

再次安装成功

原文

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持码农之家。

相关教程

  • Vue.js中使用Mixins的方法详解

    本篇文章主要介绍了在Vue.js中使用Mixins的方法,Vue的Mixins是非常实用的编程方式,可以使代码变得容易理解,有兴趣的一起来了解一下

    发布时间:2020-06-03

  • vue不通过路由直接获取url中参数的方法示例

    通过url传递参数是我们在开发中经常用到的一种传参方法,但通过url传递后改如果获取呢?下面这篇文章主要给大家介绍了关于vue如何不通过路由直接获取url中参数的相关资料,需要的朋友可以

    发布时间:2022-04-02

  • 实例详解vue拦截器Vue.http.interceptors.push

    这篇文章主要为大家详细介绍了vue拦截器Vue.http.interceptors.push的使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

    发布时间:2020-01-09

  • 移动端滑动切换组件封装 vue-swiper-router

    这篇文章主要介绍了移动端滑动切换组件封装 vue-swiper-router实例详解,需要的朋友可以参考下

    发布时间:2020-03-17

  • Vue渲染过程浅析

    Vue渲染过程浅析

    给大家整理了关于Vue的教程,这篇文章主要介绍了Vue渲染过程浅析,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

    发布时间:2023-01-05

  • Vue三种常用传值示例(父传子、子传父、非父子)

    给网友们整理关于Vue的教程,这篇文章主要介绍了Vue传值-三种常用传值示例,主要介绍了父组件向子组件进行传值,子组件向父组件传值和非父子组件进行传值,感兴趣的小伙伴们可以参考一下

    发布时间:2022-11-26

  • webpack+vue.js入门教学

    随着前端的快速发展,非常多的js框架被应用到项目中。Vue.js本身支持对组件的异步加载,配合Webpack的分块打包功能,可以极其轻松地实现组件的异步按需加载。 这篇文章是webpack+vue.j的入门教程

    发布时间:2020-07-21

  • 关于Vue子组件向父组件通信与父组件调用子组件中的方法步骤

    这篇文章主要介绍了Vue子组件向父组件通信与父组件调用子组件中的方法,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

    发布时间:2020-02-08

  • Vue用cmd创建项目具体步骤

    在本篇内容里小编给大家整理了关于Vue用cmd创建项目的方法讲解,有兴趣的朋友们跟着学习下。

    发布时间:2019-12-16

  • Vue.js父与子组件之间传参示例

    给大家整理一篇关于Vue.js的教程,本篇文章主要介绍了Vue.js父与子组件之间传参示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

    发布时间:2022-06-28

用户留言