Vuejs SPA需要根据语言为ltr和rtl加载css答案

【问题标题】：Vuejs SPA need to load css for ltr and rtl based on languageVuejs SPA需要根据语言为ltr和rtl加载css
【发布时间】：2018-04-25 05:41:50
【问题描述】：

我正在使用 Vue 构建网站，但我有 2 个单独的 css 文件，1 个用于普通 ltr，1 个用于 rtl。

现在根据 URL xyz.com/en 或 xyz.com/ar，我可以根据服务器端逻辑提供适当的文件。但是，我希望通过 Vue Router 在客户端完成。

这样 URL 可以看起来像这样 xyz.com/#/en 或 xyz.com/#/ar

【问题讨论】：

标签： css vue.js vuejs2 right-to-left vue-router

【解决方案1】：

这是一个在组件内加载条件 CSS 的示例

// change x to change color
const x = true;
if(x)
   require("./assets/style.css");
else
   require("./assets/stylegreen.css");

code snippet of conditional css loading in vue

【讨论】：

【解决方案2】：

您可以从 EN 和 AR 的相应组件中获得特定于语言的 CSS 包含 <link href="..." />，如下所示。

routes: [
    {
      path: '/en',
      name: 'Welcome EN...',
      component: WelcomeEN
    },
    {
      path: '/ar',
      name: 'Welcome AR...',
      component: WelcomeAR
    }
  ]

你认为这对你有用吗？

【讨论】：

标签不应该在文档的部分吗？
有趣 :) 我在这里找到了答案 stackoverflow.com/questions/4957446/…，如果运行顺利，我会尝试查看并标记为已接受
嗯，从技术上讲它确实有效，但不是推荐的做法......所以我不想将这种技术用于面向公众的网站......
所以这行得通stackoverflow.com/a/30308194/136999，只需要看看它是否可以被 HTML 5 验证器验证