The first time around Vue-node.js server side code published to run

1. Compile the production environment

When you start vue project locally, usually are npm run serve to start the client's web, admin backend management side, the service side of the server, but you want to publish only start a server item in to the server, it will now compile the front-end engineering to server Under contents

• Create a src directory under the front-end engineering directory named .env.development profile, content = VUE_APP_API_URL HTTP: // localhost: 8001 a variable, it is best to start with VUE_APP, the axios of baseURL into baseURL: process.env.VUE_APP_API_URL || '/' contain process.env run locally, but this property is not online.

• Add a vue-cli profile vue.config.js content in the root directory as the project file admin

  
    module.exports= {
        outputDir: __dirname + '/../server/admin',         // 将生成好的dist文件放到服务端目录下面
  
        publicPath: process.env.NODE_ENV === 'production'        // 将客户端里面原来的文件引用地址换成服务端里各文件所在的路径
        ? '/admin/'
        : '/'
    }

• The ability to add client access to server static files.

  
        server.use('/',express.static(__dirname + '/web'));    // 当访问peatechen.com/ 时为客户端
        server.use('/admin',express.static(__dirname + '/admin'));    // 当访问peatechen.com/admin时为后台管理端

2. nginx reverse proxy

Local server ip and port project on the server after starting out the storm drain or a server, external network is not accessible, then you need to use nginx proxy to the external network access request to the local port, where the use of a configuration nginx reverse proxy Web site Builder configuration file, https://nginxconfig.io , after adding generated in the / etc / nginx / sites-enabled / directory configuration file in / etc / nginx / join under the name nginxconfig.io folders

3. pm2 start server project

Into the server directory, pm2 start index.js start