Javascript 是否可以在Vue.js中有条件地导入css文件？

我在一个

Vue.js项目中有我的管理面板和客户端页面

。仅当当前路由具有

“forAdmin”

meta时，是否可以使用某些

css文件？
在
mounted（）
函数中，您可以这样添加它

if(someCondition) {
    var element = document.createElement("link");
    element.setAttribute("rel", "stylesheet");
    element.setAttribute("type", "text/css");
    element.setAttribute("href", "external.css");
    document.getElementsByTagName("head")[0].appendChild(element);
}

通过在API中使用
样式加载器
，您可以在代码中动态应用和删除样式表

首先，您需要更新您的webpack配置规则，以便使用可用API加载扩展名为
.useable.css
的样式表：

{
测试：/\.css$/,，
排除：/\.useable.css$/，
使用：[
“样式加载器”，
“css加载器”
]
},
{
测试：/\.useable\.css$/,，
使用：[
“样式加载器/可用”，
“css加载器”
]
}

现在，在路由器代码文件中，您可以导入样式表和
。使用（）
和
。根据您的情况使用（）
：

从“./admin.useable.css”导入样式
常量路由器=新的VueRouter（…）
路由器。每个之后（（到，从）=>{
for（到的常量路线匹配）{
if（route.meta.forAdmin）{
style.use（）
}
}
for（from的常量路径匹配）{
if（route.meta.forAdmin）{
样式。未使用（）
}
}
})

确保正确平衡
.use（）
和
.unuse（）
调用的总数，因为在后台会维护引用计数，以确定何时应用样式表

我不确定你的设置是什么，所以可能有更好的方法来做你想做的事情。
你在使用webpack吗？@Decademon yesI当时在想你的回答。谢谢，如果我能在网页配置中这样做的话。它在生产过程中起作用吗？谢谢：）我喜欢这里的想法，但这是交换主题的好方法吗？谢谢，谢谢，如果生产CSS加载程序与开发CSS加载程序相同，我看不出它在生产环境中不起作用的原因。如果你在生产中做一些不同的事情，比如将CSS提取到一个文件中，它将不起作用。