ENV | VUE3 的安装使用并跑通第一个项目(高效实操版)

1. 详细步骤

1.1 安装 node 和 npm

bash 复制代码
# 执行以下命令同时安装 node 和 npm(brew 的安装参考其他文章,有详细的教程。通过 apt 等其他方式能正确安装也可以)
brew install node

1.2 验证 node 和 npm 是否安装成功(可跳过)

bash 复制代码
node --version
npm --version

1.3 配置镜像源(灵活)

bash 复制代码
# 配置镜像源
# npmmirror,能用,稳定性、安全性等未知
npm config set registry https://registry.npmmirror.com/


# 配置镜像源(taobao)(应急可以临时用下)(可跳过)
# 淘宝 npm 源
npm config set registry https://registry.npm.taobao.org
# 关闭 ssl 验证
npm config set strict-ssl false


# 改回官方镜像源(设置其他镜像源同理)(可跳过)
npm config set registry https://registry.npmjs.org/


注:比较经典的淘宝镜像源 https://registry.npm.taobao.org,https 证书过期了,使用可能有风险

1.4 安装 vue-cli

bash 复制代码
npm install -g @vue/cli

1.5 验证 vue-cli 是否安装成功(可跳过)

bash 复制代码
vue --version

1.6 创建项目

bash 复制代码
vue create my-vue3-project

1.7 启动项目

bash 复制代码
cd my-vue3-project && npm run serve

1.8 访问页面

访问 http://localhost:8080,可以看到 VUE 的欢迎页面

2. 资源

2.1 VUE3

Docs

https://vuejs.org/guide/quick-start.html

https://cn.vuejs.org/guide/quick-start

GitHub

https://github.com/vuejs/core

2.2 VUE2

GitHub

https://github.com/vuejs/vue

相关推荐
ZwaterZ16 分钟前
vue el-table表格点击某行触发事件&&操作栏点击和row-click冲突问题
前端·vue.js·elementui·c#·vue
ZwaterZ2 小时前
el-table-column自动生成序号&&在序号前插入图标
前端·javascript·c#·vue
木子七5 小时前
vue2-vuex
前端·vue
小小黑0076 小时前
uniapp+vue3+ts H5端使用Quill富文本插件以及解决上传图片反显的问题
uni-app·vue
Ztiddler9 小时前
【npm设置代理-解决npm网络连接error network失败问题】
前端·后端·npm·node.js·vue
三天不学习9 小时前
前端工程化-node/npm/babel/polyfill/webpack 一文速通
前端·webpack·npm
逆旅行天涯14 小时前
【功能实现】bilibili顶部鼠标跟随效果怎么实现?
前端·javascript·vue
水w1 天前
Node.js windows版本 下载和安装(详细步骤)
开发语言·前端·windows·npm·node
DDDHL_1 天前
vitepress博客模板搭建
前端·vue
guokanglun1 天前
npm镜像查看和修改
前端·npm·node.js