3

I'm new to Vue.js and Webpack. I try to use the webpack template by using vue-cli. After generating a new project I'd like to add a backend.

My question is if it'a a good idea to add the backend(express server) to the same project?

Or should I create a new project for this?

Saurabh
  • 71,488
  • 40
  • 181
  • 244
Erik Z
  • 4,660
  • 6
  • 47
  • 74

2 Answers2

3

If you look through the issues of the template you will find a lot of answers. Especially Issue #456 is discussing this topic by using a proxy. The proxy will just mirror the api to run through the local enviroment. So you do not have any CORS issues. Another source is in the documentation folder: Backend. It basically suggest to use a proxy table which will mirror your local calls to some kind of backend. I like to run two different types of projects (one asp.net core web api and this template).

Edit your config/index.js to something like:

// config/index.js
module.exports = {
  // ...
  dev: {
    proxyTable: {
      // proxy all requests starting with /api to jsonplaceholder
      '/api': {
        target: 'http://localhost:5431',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
}

Requests to /api/posts/1 will be mirrored to http://localhost:5431/posts/1.

Kevin Peters
  • 121
  • 1
  • 7
  • 1
    Thank you. I've seen the proxyTable and set up my project using it. My question was if this is the preferd way of doing it - and it seems so. Have a look here, http://stackoverflow.com/a/41726825/162003. – Erik Z Mar 21 '17 at 10:37
2

I have the same question and found this interesting project: https://github.com/danmademe/express-vue. Seems like a possible solution and received a decent amount of stars. Disclaimer: I am also new to nodejs and can tell you more about it. I will give it a shot, particular because it has two example projects.

Here is the background blog post.

crisscross
  • 1,675
  • 2
  • 18
  • 28
  • Thank you. I've seen this port before, but this actually renders the pages on the server side. My question is whether I'm supposed to add my backend logic into the same server that's delivers my Webpack files. – Erik Z Mar 21 '17 at 10:27