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/
就能看到页面了