vue3(windows系统):vue3+vue-router+vuex+typescript在VS Code中使用vite——第一章:创建一个完整的工程目录

创建一个完整的工程目录

  • 下载安装node、npm、yarn
  • 下载安装vue、vue-router、vuex
    • vue
    • vue-router
    • vuex
  • 下载安装typescript
  • 使用vite创建工程目录

下载安装node、npm、yarn

node下载
node.js下载地址
node安装——一路下一步
安装完毕查看是否成功
管理员打开cmd(以下全都要管理员打开cmd)

npm -v

出现x.x.x字样安装成功,否则失败
成功进入下一步,失败关电脑出去玩
yarn安装

npm install yarn -g

查看yarn版本

yarn --version

关于npm和yarn的使用方法不做介绍
两者统一
加-g是全局 加-save是在工程 -dev仅在开发环境中使用

npm install xxx -g
npm install xxx --save
npm install xxx --dev
npm install xxx --save-dev

也就是这四个,用yarn自己把npm install 换成yarn add

下载安装vue、vue-router、vuex

vue

npm install vue@next
or
yarn add vue@next

查看vue版本

vue -V
这里的-V要用大写的V

vue-router

npm install vue-router@4
or
yarn add vue-router@4

vuex

npm install vuex
or
yarn add vuex

失败关电脑出去玩

下载安装typescript

npm install typescript
or
yarn add typescript

失败关电脑出去玩

使用vite创建工程目录

  1. 创建目录

npm init vite-app 工程目录文件夹名,例(npm init vite-app vue3-vite)
or
yarn create vite-app 工程目录文件夹名,例(yarn create vite-app vue3-vite)

  1. 进入目录

cd 工程目录文件夹

  1. 安装依赖

npm install
or
yarn

  1. 启动服务

npm run dev

失败关电脑出去玩
成功的话在浏览器输入提示的网址,齐活。

你可能感兴趣的:(vue,前端,typescript,vue.js,typescript)