Question

对于以下github项目： https://github.com/miyaoka/grid-generator.git

我先运行yarn install，然后再运行npm run generate命令。

然后，我将dist文件夹的所有内容都放入xampp的htdocs中，并将dist文件夹的内容放入xampp中，但随后从控制台中得到了很多ERR_FILE_NOT_FOUND。

但是当我获取dist文件夹的内容并将其直接放在htdocs的根目录（直接在htdocs内而不在任何文件夹内）时，一切正常。

我应该在nuxt.config.js中添加什么？究竟在nuxt.config.js里面？为了能够从htdocs内的文件夹中运行项目？

在我更新nuxt.config.js之后，我需要再次运行哪个命令？

nuxt.config.js文件：

const nodeExternals = require('webpack-node-externals')

module.exports = {
  modules: ['~/modules/typescript'],
  plugins: ['~plugins/vue-awesome.js'],

  /*
  ** Headers of the page
  */
  head: {
    title: 'CSS Grid Layout generator',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: 'Nuxt.js project' }
    ],
    link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }]
  },
  /*
  ** Customize the progress bar color
  */
  loading: { color: '#3B8070' },
  /*
  ** Build configuration
  */
  build: {
    vendor: ['vue-awesome'],
    /*
    ** Run ESLint on save
    */
    extend(config, ctx) {
      if (ctx.dev && ctx.isClient) {
        config.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /(node_modules)/
        })
      }
      if (ctx.isServer) {
        config.externals = [
          nodeExternals({
            // default value for `whitelist` is
            // [/es6-promise|\.(?!(?:js|json)$).{1,5}$/i]
            whitelist: [/es6-promise|\.(?!(?:js|json)$).{1,5}$/i, /^vue-awesome/]
          })
        ]
      }
    }
  }
}

Answer 1

您需要设置router.base

export default {
  router: {
    base: '/app/'
  }
}

dist文件夹内容仅在服务器的根目录上有效

1 个答案: