首頁  >  問答  >  主體

node.js - 怎么使用webpack vue配合express进行开发

我现在通过vue-cli来初始化项目,将后台相关的代码放在 根目录下的 server文件夹下,并且webpack启动了8080端口的本地服务器,server下的express启动了3000端口的服务器。
目前 我可以通过如下方式前台发起get请求获取到express的response,大概发起与接收清代如下。

export default {
  data () {
    return {
      a: 'aaaaaaa'
    }
  },
  components: {
    Hello
  },
  created: function () {
    this.$http.get('http://localhost:3000/api/test').then(function (data) {
      console.log(data)
    })
  }
}
var express = require('express');

var app = express();

var api = require('./routes/api');

// 跨域支持
app.all('*', (req, res, next) => {
  const origin = req.headers.origin;
  res.header('Access-Control-Allow-Origin', origin);
  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, token');
  res.header('Access-Control-Allow-Credentials', true);
  res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, OPTIONS, DELETE');

  next();
});

app.use('/api', api);

app.listen(3000);
var express = require('express');

var router = express.Router();

router.get('/test', function (req, res, next) {
  res.send({msg: 'success'});
})

module.exports = router;

然后这个msg的值 就存在了 response.body下
现在我有2种选择,因为想做一个社区做为毕业设计,那使用
vue-router 还是 express做路由 比较好呢?
使用vue-router 就是通过localhost:8080来访问页面, 后台是通过返回json数据,前台vue获取来渲染页面?
使用express的路由, 就是通过localhost:3000来访问页面,后台直接发送静态文件,或者是否可以在ejs模板引擎中使用vue组件呢?

阿神阿神2764 天前591

全部回覆(1)我來回復

  • PHP中文网

    PHP中文网2017-04-17 14:54:01

    那是因為vue-cli已經自備了express,cli本身就是一站式環境搭建。你可以看下package.json,裡面已經有express

    關於express.Router()的話,之前我也沒用過,就去官網看了下。你試試在router.get()程式碼後面加上app.use(router)試試。

    router.get('/test', function (req, res, next) {
      res.send('test');
    })
    
    app.use(router);
    
    app.listen(3000);

    express.Router()連結:http://expressjs.com/zh-cn/4x...

    回覆
    0
  • 取消回覆