Vue
npm 报错
错误一 CERT_HAS_EXPIRED
如果你在使用 npm 安装的时候遇到了这个报错,那大概率就是你的npm源地址过期了,你需要重新更换一下。
npm 换源
终端指令:npm config get registry
---> 查看当前源地址
终端指令 --- > 修改你的源地址
npm config set registry https://registry.npm.taobao.org
//换位淘宝
npm config set registry https://mirrors.huaweicloud.com/repository/npm
//换位华为
Vue 安装脚手架
Node 版本要求
Vue CLI 4.x 需要 Node.js v8.9 或更高版本 (推荐 v10 以上)。你可以使用 n,nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本。
终端指令 npm install -g @vue/cli
安装之后,你就可以在命令行中访问 vue
命令。你可以通过简单运行 vue
,看看是否展示出了一份所有可用命令的帮助信息,来验证它是否安装成功。
你还可以用这个命令来检查其版本是否正确:
版本
vue --version
升级
npm update -g @vue/cli
Vue 创建项目
通过 vue create 方式创建
vue create hello-world
这里会提示你是否更换一个更快的nopm源,我们都可以。我选择的是 yes
三种创建方式:
- 默认套餐,vue2版本,提供babel和eslint支持。
- 默认套餐,vue2版本,提供babel和eslint支持。
- 自定义创建,自己去选择需要的功能,提供更多的特性选择。比如如果想要支持 TypeScript ,就应该选择这一项。
自定义选项的话,要了解一下下面的内容
vue-cli 内置支持了8个功能特性,可以多选:使用方向键在特性选项之间切换,使用空格键选中当前特性,使用 a 键切换选择所有,使用 i 键翻转选项。
对于每一项的功能,此处做个简单描述:
Choose Vue version:选择版本 Babel:支持es6 转 es5 TypeScript:支持使用 TypeScript 书写源码。 Progressive Web App (PWA) Support:PWA 支持。 Router:支持 vue-router 。 Vuex:支持 vuex 。 CSS Pre-processors:支持 CSS 预处理器。 Linter / Formatter:支持代码风格检查和格式化。 Unit Testing:支持单元测试。 E2E Testing:支持 E2E 测试。
在这里如果遇到了 log-level 相关的报错,就在指令前面加上 sudo
, 用管理员身份运行。
这是创建好的样子。
可以 cd 进目录,然后通过 npm run serve
指令,开始初始化,并打开项目
通过脚手架方式创建
使用vue初始化基于webpack的新项目:
vue init webpack my-project
通过网页端创建
终端指令 ---> vue ui
运行后,打开浏览器,你会看到网页创建的相关操作指示
npm run serve
我们 cd 进项目目录后,然后 npm run serve
通过浏览器打开本地这个ip
- Local: http://localhost:8080/
至此,你的第一个vue 项目 创建成功!