Nuxt3 执行generate静态化后,css无效,js不执行
时间: 2023-11-26 11:03:33 浏览: 246
movies-web:Nu Simple Nuxt(全静态)+带有预览模式的理智
如果在 Nuxt3 中执行 `nuxt generate` 命令生成静态文件后,CSS 无效、JS 不执行,可能是因为生成的静态文件没有包含相应的 CSS 和 JS 文件。
解决方法如下:
1. 确认你的 CSS 和 JS 文件都在 `nuxt.config.js` 中的 `head` 属性中被引入了。例如:
```js
export default {
head: {
link: [
{
rel: 'stylesheet',
href: '/path/to/your/css/file.css'
}
],
script: [
{
src: '/path/to/your/js/file.js',
body: true
}
]
}
}
```
2. 确认你的 CSS 和 JS 文件被正确地打包到了静态文件中。你可以使用 Chrome Devtools 的 Network 面板来检查资源是否被成功加载。
如果静态文件中确实没有相应的 CSS 和 JS 文件,你可以将 `generate` 命令的 `fallback` 属性设置为 `true`,这样 Nuxt3 将会在运行时动态生成缺失的文件。
```js
export default {
generate: {
fallback: true
}
}
```
运行 `nuxt generate` 命令后,静态文件中应该就会包含相应的 CSS 和 JS 文件了。
阅读全文