vue-cli 两种创建项目的方法

0. 依赖安装 （全局）0.1 第一步，先安装node.js：下载好node.js后点击安装，一路下一步就行，如果中途出现错误信息2503或2502的一般情况下（我遇到的情况）是因为权限不足，需要以管理员的身份打开CMD0.2 第二步： 安装npm0.3 vue-cli 脚手架 安装 1.初始化项目的方法1.1 手动创建项目：1.2图形化创建项目：

0. 依赖安装 （全局）

根据vue官方文档说明，首先得安装node.js,因为vue依赖于node的npm的管理工具来实现

0.1 第一步，先安装node.js：下载好node.js后点击安装，一路下一步就行，如果中途出现错误信息2503或2502的一般情况下（我遇到的情况）是因为权限不足，需要以管理员的身份打开CMD

输入 node -v 出现版本号，说明安装完成。

node -v

0.2 第二步： 安装npm

vue是依赖npm工具来管理，虽然node自带npm，但是不是最新版本，可以输入 npm -v，看一下， 所以接下来我们来安装npm，输入命令:

npm install - g npm

或者使用淘宝cnpm镜像

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

安装成功后输入：npm -v 如果看到版本号，说明安装成功

0.3 vue-cli 脚手架 安装

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

查看vue-cli是否成功：

1.初始化项目的方法

1.1 手动创建项目：

第一步： 安装vue-cli成功后，通过cd命令进入你想放置项目的文件夹，在命令提示窗口执行创建vue-cli工程项目的命令： vue init webpack my-project-name

第二步： 确认创建项目后，后续还需输入一下项目名称、项目描述、作者、打包方式、是否使用ESLint规范代码等等

第三步： 生成目录如下：

第四步：安装cpnm依赖 进入到项目中，一定要进入刚刚新创建的项目里，输入命令

cnpm install

第五步：启动项目 cnpm run dev

http://localhost:8080/，打开浏览器，输入访问地址，看到页面

利用vue-cil初始化构建vue项目，我们会获得一个初始化的文件夹结构，如下： 目录结构:

1.2图形化创建项目：

第一步：创建文件夹，启动ui界面 输入命令：

mkdir vue-ui cd vue-ui vue ui

注意：cmd无法识别vue ui命令

vue -h(这是查看vue说明的在项目看有没有ui这个命令)

如果你那里面没有这个ui 的话，是你的cil版本低建议升级下版本 点下面的Node.js 之后输入：

cnpm i -g @vue/cli

完成后用 vue -V ，查看版本

如果成功识别 vue ui，请忽略上面步奏 成功界面如下： 第二步：开始创建项目 在浏览器里打开：http://localhost:8000 第三步： 第四步：填写项目名

第五步：选择一个预设 ；点击创建项目

第六步：添加插件

第七步：项目依赖管理

第八步：项目配置管理 第九步：项目任务管理