nuxt-link 在开发和 generate/production 模式下制作不同的 url
nuxt-link makes different urls in development and generate/production mode
我创建了一个 nuxt 项目,在开发模式下它工作正常,但是当我 运行 npm run generate
或将它托管在服务器上时,links 由 nuxt-link 没有正确的 href 值。例如这是在开发模式下生成的地址:
<nuxt-link :to="{name: 'lang-music', params: {lang: key, music: song.name}}"></nuxt-link>
http://localhost:3000/yiddish/Die%20goldene%20Pave
但是在 gitlab 页面上它生成:
https://username.gitlab.io/yiddish/Die%20goldene%20Pave
虽然应该是:
https://username.gitlab.io/learnlyric/yiddish/Die%20goldene%20Pave
我的页面文件夹结构:
问题是 Nuxt 不知道你的基础 url,你只需要将它添加到 nuxt.config.js
文件。
// nuxt.config.js
export default {
router: {
base: process.env.DEPLOY_ENV === 'GH_PAGES' ? '/learnlyric' : '';
}
}
有关详细信息,请参阅 Nuxt documentation。
我创建了一个 nuxt 项目,在开发模式下它工作正常,但是当我 运行 npm run generate
或将它托管在服务器上时,links 由 nuxt-link 没有正确的 href 值。例如这是在开发模式下生成的地址:
<nuxt-link :to="{name: 'lang-music', params: {lang: key, music: song.name}}"></nuxt-link>
http://localhost:3000/yiddish/Die%20goldene%20Pave
但是在 gitlab 页面上它生成:
https://username.gitlab.io/yiddish/Die%20goldene%20Pave
虽然应该是:
https://username.gitlab.io/learnlyric/yiddish/Die%20goldene%20Pave
我的页面文件夹结构:
问题是 Nuxt 不知道你的基础 url,你只需要将它添加到 nuxt.config.js
文件。
// nuxt.config.js
export default {
router: {
base: process.env.DEPLOY_ENV === 'GH_PAGES' ? '/learnlyric' : '';
}
}
有关详细信息,请参阅 Nuxt documentation。