安装node.js
从node.js官网下载并安装node
安装过程很简单，只要一直单击下一步就可以了。
1.1打开命令行工具(win R )，输入node -v验证node的版本。 显示相应的版本号后，表示安装成功
1.2.npm包管理器集成在node中，因此安装node后可以进行npm，然后直接键入npm -v命令以显示npm的版本信息。
当前已安装node环境，并且还具有npm包管理器。 我听说，由于某些npm资源被切断，或者国外资源，npm在安装依赖软件包时经常会失败。 因此，还需要npm的国内镜像——淘宝镜像(cnpm )。
安装cnpm
在命令行中输入NPM install-gcn pm-- registry=https://registry.NPM.Taobao.org，以确保安装成功。 (我的已经安装，将显示一条消息，说明更新成功。 ) :
完成后，可以使用cnpm而不是npm来安装依赖软件包。
安装vue-cli脚手架搭建工具
在命令行中运行命令npm install -g vue-cli，然后等待安装完成。 下图：
通过以上三个步骤，您已经具备了需要准备的环境和工具，然后使用vue-cli生成项目。
首先，选择要保存项目的位置。 在这里进入e盘。 也可以使用其他驱动器盘符创建。 使用DOS命令e:进入e驱动器，然后输入dir查看所有e驱动器上的所有文件和文件夹。 当前，e驱动器上没有名为NodeDemo的文件夹。
2 .然后开始创建新文件夹。 (这里我把创建的NodeDemo文件夹放入了e驱动器。 您也可以选择其他驱动器盘符保存demo。 )键入md NodeDemo，然后按回车键，注意md后面有一个空格。 然后，可以在dir中确认是否创建了文件夹，如下图所示。 (已创建) )。
3 .然后用cd命令将目录移动到所选目录：
在NodeDemo目录中，在命令行中运行命令vue init webpack firstApp。 解释此命令意味着要初始化项目，其中webpack是一个构建工具，这意味着整个项目都基于webpack。 其中firstApp是整个项目文件夹的名称，该文件夹将自动生成在您指定的目录中。 在我的示例中，它将生成在NodeDemo目录中。
执行初始化命令时，用户输入一些基本配置选项，如项目名称、项目说明和作者信息。 对于不明白的信息和不想填写的信息，经常用回车来填写就可以了。 下图：
稍等片刻，您将看到项目创建成功，如下图所示
接下来，查看NodeDemo目录，查看是否创建了文件。
打开firstApp项目。 项目中的目录如下。
介绍目录及其作用。
build :最终发布的代码的存储位置。
config :包括配置路径、端口号等信息。 刚开始学习时选择默认配置。
node_modules:npm加载的项目依赖模块，((整个项目所需的依赖资源) ) )。
src :这里是我们开发的主要目录。 基本上要做的事情都在这个目录里。 那里包含了几个目录和文件。
assets:放置着标志等照片
components:目录包含组件文件，所以可以不用。
App.vue :项目门户文件。 也可以不使用components目录将组件写在此处。
main.js :项目核心转储文件
静态：图像、字体等静态资源目录。
test :初始测试目录，可删除
. XXXX文件：配置文件。
index.html :首页门户文件。 可以添加元信息和同步统计代码等。
package.json :项目配置文件。
自述. MD :项目文档。
这就是整个项目的目录结构。 其中，我们主要在src目录中进行修改。
(第一次创建vue项目时，似乎没有名为node_modules的依赖包资源，但如果不能，则只需安装cnpm install并安装依赖包资源即可。 )现在创建我的项目后，它包含一个名为node_modules的依赖包资源文件夹，因此您可以在不安装cnpm install的情况下安装依赖包资源。
安装项目所需的依赖cd位于firstApp文件夹中
然后运行cnpm安装。 (这里可以使用cnpm代替npm。 ）
安装完成后，去自己的项目看看吧。 (如果没有) node_modules文件夹增加一个。 这是所需的依赖包资源。
安装依赖包资源后，可以运行整个项目。 在运行项目之前，请确保存在依赖包资源
项目执行
在项目目录中，当命令npm run dev运行时，将在热负载下执行APP应用。 热加载使您可以在更改代码后实时查看更改的效果，而无需手动更新浏览器。
启动项目后，在浏览器中输入启动项目后的地址： localhost:8080
浏览器中将显示vue徽标：
下一篇：从Git克隆的vue项目在本地执行步骤