浅谈Vue服务端渲染框架Nuxt的那些事

  extendRoutes (routes, resolve) {
   routes.push({
    name: 'father',   /** 自定义路由的name **/
    path: '/father',  /** 自定义路由的path **/
    component: resolve(__dirname, 'pages/father/index.vue'), /** 组件路径 **/
    children: [{  /** 子路由配置 （其它相同） **/
     name: 'son',
     path: '/son',
     component: resolve(__dirname, 'pages/son/index.vue')
    },
    {
     name: 'daughter',
     path: '/daughter',
     component: resolve(__dirname, 'pages/daughter/index.vue')
    }]
   })
  }

 "scripts": {
  "dev": "cross-env NODE_ENV=development PORT=3333 nuxt",
  /** 本地环境：这里给环境变量NODE_ENV指定了对应的development的值和指定了运行端口 **/
  "build": "cross-env NODE_ENV=online nuxt build",
  /** 打包：指定了环境变量的值为online **/
  "start": "HOST=0.0.0.0 PORT=3333 nuxt start",
  /** 打包：指定了环境变量的值为online 端口为3333 HOST为0.0.0.0 百度了一下，
  0.0.0.0代表本机的所有ip地址,即同网段其他机器也可以访问的，
  默认的127.0.0.1由于和本地ip绑定了，所以只有绑定到本机地址的服务能被同网段其他机器访问**/
  "generate": "nuxt generate",
  "lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
  "precommit": "npm run lint"
 },

  /** 自定义请求base_url **/
if (process.env.NODE_ENV === 'test') {
 axios.defaults.baseURL = 'http://test'
} else if(process.env.NODE_ENV === 'online') {
 axios.defaults.baseURL = 'http://online'
} else {
  axios.defaults.baseURL = 'http://127.0.0.1'
}

/** 下面声明了一个PATH_TYPE变量，其余的不需要改变，只需要将对应的NODE_ENV改成PATH_TYPE即可 **/
env: {
  PATH_TYPE: process.env.PATH_TYPE
}

  optimization: {
   runtimeChunk: {
    name: 'manifest'
   },
   splitChunks: {
    chunks: 'all',
    cacheGroups: {
     libs: {
      name: 'chunk-libs',
      chunks: 'initial',
      priority: -10,
      reuseExistingChunk: false,
      test: /node_modules\/(.*)\.js/
     },
     styles: {
      name: 'chunk-styles',
      test: /\.(scss|css)$/,
      chunks: 'all',
      minChunks: 1,
      reuseExistingChunk: true,
      enforce: true
     }
    }
   }
  },
  extractCSS: true, /** 将css单独打包成一个文件，默认的是全部加载到有事业 **/