Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。

将vue项目部署到node服务器上：

一、准备工作

1、先去官网注册账号注册登录之后，看到这个界面：

2、可以看大支持的语言还是很多的 ，我们选择Node.js,跳转到这个界面：

3、下载工具：我们点击I'm ready to start按钮,跳转到这样一个界面，要求我们下载一个Heroku 的CLI 工具，如果你是部署到其他平台，一般也会让你下载一个对应的工具，用于后期的代码提交，这里按照提示下载安装就行了。

4、远程登陆：安装好了之后，打开一个命令行，根据页面上的提示登陆heroku，命令：heroku login,然后输入heroku的账号和密码。登陆成功会有相关的提示语。
然后点击页面下方的 I have installed the Heroku CLI,然后会跳到这个页面：

cone代码：按照页面提示，先进入到一个你要存放代码的文件夹，然后把他的代码克隆下来：git clone https://github.com/heroku/node-js-getting-started.git.

clone完了之后，我们可以看到这个文件夹下多了一个node-js-getting-started文件，进入这个文件夹：cd node-js-getting-started;

二、创建项目

然后点击页面上的I cloned the app source code按钮,然后会进入到一个创建项目教程的页面，按照他给的步骤来做一般是不会出什么问题的，大致走一下这个流程;

1、创建一个应用：heroku create;

上面紫色的那一串就是应用的名字，这个名字是随机生成的，你也可以指定一个名字:heroku create appName.把https://ancient-forest-54677.herokuapp.com/ 在浏览器打开[也可以使用命令heroku open打开]，看到以下界面，表明这个应用已经创建好了：

2、然后我们把刚才生成代码push到服务器上去，使用命令：git push heroku master:

看到上面这个界面就表示已经push 完了，然后在命令行输入命令:heroku open，能看到现在界面变成了下面这样：

这表明我们刚才提交的代码已经部署到服务器上了，你看到的这个界面的代码，是生成项目的默认代码。

三、提交自己的代码

关于heroku 的其他一些命令，可以自己看文档，上面教程什么都比较齐全，这里就不再多说了，下来重点说一下怎么把自己的代码部署上去。

1、我们把node-js-getting-started这个文件夹放到sublime 里打开，先研究一下这个目录结构。

这个结构是很简单的了，public文件夹里应该放的是一些静态资源文件，文件夹里放的是页面文件，其他的都是一些配置项。

2、把我们自己的代码放进这个项目里。

• 将之前的那个vue 项目先打包，生成一个dist文件，dist文件里一个index.html文件，这就是我们的视图文件，还有一个static文件，里面放的是就是静态资源文件。

• 删除views/pages/下的index.ejs文件,将dist文件里的 index.html文件放进pages文件夹里，并把后缀名改成.ejs，将static整个文件夹放进public文件夹里(这一步非常重要)；

• 我们之前那个vue项目有一个写着后台接口的文件，就是server/router.js文件，我们为了区分，在node-js-getting-started文件夹下新建一个routers文件夹，然后将router.js文件放进去；

• 然后我们在index.js文件里将这个路由引入使用，代码如下：

var router = require("./routers/router");
app.use(router);

注：这个代码要写在生成app之后，启动服务器之前。

3、然后我们将代码push到服务器

在node-js-getting-started目录下打开git 命令行工具，然后依次输入以下三个命令：

• gir add .

• git commit -m '这里是你自己添加的提交的信息'

• git push heroku master

输入完这个命令后，会看到一个上传进度，直到看到下面这个界面，就表示上传完成了。