vue 脚手架创建项目

1、前期准备

• 检查 node 是否安装
• 检查 npm 是否安装

npm -v
node -v

2、设置国内源，这样你的下载速度会非常快：

npm config set registry https://registry.npm.taobao.org

// 查看源
npm config list

3、安装 vue 和一些相关组件

npm install @vue/cli -g

//卸载vue
npm uninstall vue-cli -g

//安装node-gyp
npm install -g node-gyp
npm install -g @vue/cli-init

4、Vue脚手架有两种创建方式

1. 最快捷的，也就是最新版本vue/cli所带的：Vue create 文件名称
2. vue init webpack 文件名

4.1、Vue create 文件名称

• 输入创建指令并回车

  vue create project_name

• 进入到当前界面，方向键选择创建是vue2还是vue3还是自由选择（注：目前学的一般都是vue2，vue3只不过是增加的大量的新特性）选中后进行回车

  Vue CLI v4.5.11
  ? Please pick a preset: (Use arrow keys)
  > Default ([Vue 2] babel, eslint) 
   Default (Vue 3 Preview) ([Vue 3] babel, eslint) 
   Manually select features

• 静候创建完成

4.2、vue init webpack 文件名

安装过程中一次提示如下：

project name（项目名称）	  # 按回车
project description（项目描述）	 # 按回车
author（作者）	 # 按回车
vue build（解释器）	 # 按回车
Install vue-router(路由) 		# 按y按回车
use aslantto lint your code(代码检查) 	# 按n按回车
set up unit tests(测试模块) 	# 按n按回车
setup e2e tests with night watch(是否安装e2e) 	# 按n按回车
should we run ’npm install’(是否选择npm方式)	# 选第一个，按回车

运行完之后cd 到项目中，可以安装一些常用的包

npm install axios --save
npm install style-loader —-save
npm install heyui --save
npm install js-md5 --save

5、安装完之后可以直接启动

npm run serve

退出服务

ctrl + c

如果出现任何关于node依赖的问题导致服务无法启动，执行npm install无法解决的，则安装 rimraf，然后进入项目目录下，执行 rimraf node_modules 删除后，重新执行 npm install 安装依赖

//安装rimraf
npm install rimraf -g

//删除node_modules
rimraf node_modules

//重新安装node_modules
npm install