Vue如何创建一个新的项目（Vue-cli2.x脚手架使用教程）

一、为确保项目能正常搭建请先去node.js官网下载node进行安装

1、安装步骤

打开https://nodejs.org/zh-cn/点击下载

下载完成后打开所在目录

点击安装

直至Finish完成后，打开cmd命令行窗口检查是否安装成功，如果node、npm都有版本号说明安装成功
在这里插入图片描述

淘宝镜像的使用

当node安装成功之后且npm能正常运行，我们就可以通过一些npm install xxx指令来下载一些东西了，考虑到npm的服务器在国外，拉取npm包的列表、下载包这个过程会比较缓慢。建议大家安装淘宝镜像来解决此问题，淘宝镜安装成功后就可以通过cnpm install xxx指令来下载所需要的东西了，当然这个时候npm依旧可用

cmd命令行输入指令安装淘宝镜像

npm install -g cnpm --registry=https://registry.npm.taobao.org

二、项目搭建

1、打开你要创建项目的主目录（一般你写的项目包名都会在里面）

打开PowerShell窗口后，执行start cmd指令可打开cmd命令行窗口（非window10以上系统应该是在上一步就可以直接打开cmd的，若一打开就是cmd可忽略此步骤）

2、安装vue-cli

cnpm install vue-cli -g //全局安装vue-cli

查看vue-cli是否安装成功，vue list

vue init webpack ”项目名称“

项目创建好后，打开刚刚创建好的test文件夹，检查node_modules依赖，缺少依赖就用cnpm install或者npm install补全

项目运行方法一：cmd窗口运行

项目运行方法二：使用web开发者工具编辑器运行（vscode、webstorm等等）
我这里用的是webstorm

如果你想让项目运行时自动打开浏览器，只需把config>>index.js里的autoOpenBrowser由false改为true

喜欢就给个小红心，关注我，接下来的文章将带你了解如何在项目创后好后进行基本的环境配置、开发、打包等，0基础教学，带小白走上巅峰之路，
技术交流群：186222982，欢迎咨询

简书同步：IT小白_