vue3+typescript项目开发 (一)升级相关组件

使用vue2开发项目2年了,那个时候typescript还没有流行,一晃2年过去了,现在已经vue3+typescript大行其道了,所以打算还是把自己的项目升级一下。

第一步:自然是升级node

https://nodejs.org/en/   到官网下载最新稳定版本进行安装

我安装的是10.15.3 LTS

第二步:升级vue-cli 重新安装vue-cli

cnpm install -g @vue/cli  

输入命令vue --version 查看下版本信息

3.5.5

第三步:升级npm

npm install npm@latest -g

第四步:创建项目

执行:vue create go-eplat-manage

此处有两个选择:

default (babel, eslint)默认套餐,提供babel和eslint支持

Manually select features自己去选择需要的功能,提供更多的特性选择。比如如果想要支持 TypeScript ,就应该选择这一项。我选择的就是这一项

对于每一项的功能,此处做个简单描述:

  • TypeScript 支持使用 TypeScript 书写源码
  • Progressive Web App (PWA) Support PWA 支持。
  • Router 支持 vue-router 。
  • Vuex 支持 vuex 。
  • CSS Pre-processors 支持 CSS 预处理器。
  • Linter / Formatter 支持代码风格检查和格式化。
  • Unit Testing 支持单元测试。
  • E2E Testing 支持 E2E 测试。

点击空格进行选中 我选择了 TypeScript 、Router,Vuex,CSS Pre-processors,Linter / Formatter

创建后的项目如下:
在这里插入图片描述
进入项目目录,执行命令

cnpm run server

启动成功后
在这里插入图片描述

在浏览器中输入http://localhost:8080/,如果展示出下面的界面,表示项目搭建成功。
在这里插入图片描述

你可能感兴趣的:(vue)