创建vue项目(2.x版本 & 3.x版本)

154 阅读1分钟

vue2.x版本

1、安装nodejs环境

nodejs下载网址:nodejs.org/en/

检查是否安装成功
在这里插入图片描述

2、为了提高效率,可以使用淘宝的镜像:npm.taobao.org/

输入:npm install -g cnpm registry=registry.npm.taobao.org,即可安装npm镜像,cnpm可替代npm
在这里插入图片描述
检查是否安装成功
在这里插入图片描述

3、搭建vue项目环境

全局安装vue-cli
cnpm install -g vue-cli
在这里插入图片描述

4、搭建vue项目

进入你要创建项目的目录,创建一个基于 webpack 模板的新项目:
vue init webpack 项目名
在这里插入图片描述
说明:
Vue build ==> 打包方式,回车即可;
Install vue-router ==> 是否要安装 vue-router,项目中肯定要使用到 所以Y 回车;
Use ESLint to lint your code ==> 是否需要 js 语法检测 一般不需要,n回车;
Set up unit tests ==> 是否安装 单元测试工具 ,一般不需要 所以 n 回车;
Setup e2e tests with Nightwatch ==> 是否需要 端到端测试工具 一般不需要 所以 n 回车;

vue3.x版本

vue-cli3.0 要 nodeJs ≧ 8.9
我安装的是 node12.18.2 版本,如果之前在本地全局安装了 2.0 的环境,需要全局卸载再安装 3.0

1、安装vue环境

先卸载旧版本

npm uninstall -g vue-cli
 
npm install -g @vue/cli

安装好了查看版本
在这里插入图片描述

2、搭建项目

vue create <Project Name> //文件名 不支持驼峰(含大写字母)

运行项目命令由npm run dev变成了npm run serve 就酱