极客观点
项目管理
HarmonyOS
<template>
<div class="container">
<head>
<link rel="stylesheet" href="~assets/css/style-light.css" />
<link rel="stylesheet" href="~assets/css/login-light.css" />
</head>
</div>
</template>
像上面那样导入css会导致这个错误
vue.runtime.esm.js:5717 GET http://localhost:3000/~assets/css/login-light.css net::ERR_ABORTED 404 (Not Found)
除了将整个 css 放在模板中之外，真的没有其他加载 css 的方法吗？
原文由 obliviousfella 发布，翻译遵循 CC BY-SA 4.0 许可协议
您可以使用 head 方法将文件带入，如下所示：
head () {
return {
link: [
{ rel: 'stylesheet', href: '/style-light.css' },
{ rel: 'stylesheet', href: '/login-light.css' }
]
}
}
您还应该将这些 css 文件移动到静态文件夹中。请参阅 Vue 论坛上的此讨论 https://forum.vuejs.org/t/nuxt-import-css-file-and-js-file/42498
原文由 MailboxArsonist 发布，翻译遵循 CC BY-SA 4.0 许可协议
5 回答4.8k 阅读✓ 已解决
4 回答3.1k 阅读✓ 已解决
3 回答4.9k 阅读✓ 已解决
5 回答2k 阅读
2 回答4.8k 阅读✓ 已解决
4 回答4.4k 阅读✓ 已解决
4 回答1.9k 阅读✓ 已解决
您需要知道的第一件事是，您不能在任何地方声明 html 头，也不能在您的模板中，也不能在您的组件中，也不能在您的页面中，也不能在任何地方。
请记住，您不能为此使用 html 标签，您将使用 json 模式。
查看 https://nuxtjs.org/guide/configuration 以获得更详细的解释。
现在你怀疑是否要全局导入 CSS，正确的位置是在你的 nuxt.config.js 中，在这个文件中，你有一个名为 head 的属性，在 head 中我们将配置所有导入。
因此，在 nuxt.config.js 中找到你的 head session，然后创建一个名为 css 的新属性，如下所示：
另一种方法是直接在组件中导入您的 css，为此您可以执行以下操作：
在 Nuxt 中，您还需要在应用程序中安装 CSS 加载器，因此请确保您已在应用程序中安装了“stylus”和“stylus-loader”。