vue与node结合开发部署

2019-01-15  本文已影响10人  泪滴在琴上

服务端,使用nodejs搭配express 框架配合搭建提供一个API服务,以及服务端渲染,客户端则选择 vuejs 开发前端页面,vue-router做路由,vuex做状态管理 , axios 做ajax请求。

创建服务端

mkdir server
cd server/
touch app.js

安装express

npm install express --save
npm install body-parser --save

写后端启动文件 app.js

var express = require('express');
var fs = require('fs');
var path = require('path');
var bodyParser = require('body-parser');
var app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
// 访问静态资源
app.use(express.static(path.resolve(__dirname, '../dist')));
// 访问单页
app.get('*', function (req, res) {
var html = fs.readFileSync(path.resolve(__dirname, '../dist/index.html'), 'utf-8');
 res.send(html);
});
// 监听
app.listen(8081, function () {
  console.log('success listen...8081');
});

打包并部署

npm run build
node server/app.js

在浏览器输入 http://127.0.0.1:8081/ 就能看到页面了

上一篇下一篇

猜你喜欢

热点阅读