学习vue3的搭建
Vue3 + Vite项目构建
环境准备
1. NodeJs安装
安装NodeJs，安装成功后，以管理员身份打开命令行，输入命令
node -v
查看NodeJs版本；输入命令
npm -v
查看npm版本。
2. 安装cnpm
因为npm是国外的，下载资源的时候会翻墙，这会降低下载速度，所以使用cnpm。输入命令
npm install -g cnpm --registry=https://registry.npm.taobao.org
等待安装完成，然后查看 cnpm 版本
cnpm -v
3. 安装vue-cli
执行命令
cnpm install -g @vue/cli
安装完成后，输入命令注意最后一个是大写的V
vue -V
显示vue的版本。
4. 安装 yarn
执行命令
npm install -g yarn
配置yarn 下载的国内淘宝镜像
yarn config set registry https://registry.npmmirror.com/
查看 yarn 镜像
yarn config get registry
Vue项目搭建
1. 创建web文件夹
通常创建一个web文件夹（如web-projects）来管理自己的web项目，方便自己查看和管理，切记路径中不能有中文
2. 打开命令行
进入web文件夹，这里以web-projects为例
3. 使用yarn + vite 创建vue项目
在命令行中执行命令
yarn create vite 项目名称 --template vue
创建成功后，进入创建的项目目录，然后 执行 yarn 命令进行依赖的安装
5. 启动项目
执行命令
yarn dev
启动项目，出现如下界面表示启动成功
6. 浏览器中访问
打开浏览器，输入
http://127.0.0.1:5173/
访问
原文地址：https://blog.csdn.net/weixin_45621552/article/details/140625569
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！