Question

我正在创建一个使用Iron Router路由的Meteor站点。每个子页面都有自己的文件夹，它有自己的Scss文件。问题是所有Scss文件在编译后在每个子页面上都可用。

通过添加html class="homePage"或html class="adminPage"，然后使用.adminPage {...code goes here...}为样式添加前缀，可以很容易地解决这个问题，但是当涉及到排除大文件时，例如整个html5reset.scss，前缀所有名字都不是一个好的解决方案。如何从特定路由中排除html5reset.scss个文件？

file structure
/homepage
  > global.scss
  > homePage.scss
  > html5reset.scss

/404
  > global.scss
  > 404Page.scss
  > html5reset.scss

/admin
  > global.scss
  > adminPage.scss
  // NO HTML5 reset

/framework
  > global.scss
  > frameworkPage.scss
  // NO HTML5 reset

这就是我动态设置html类名的方法：

HTML

<template name="homePage">
  {{HTML_CLASS 'homePage'}}
</template>

CLIENT JS

// dynamically set html class
Handlebars.registerHelper( "HTML_CLASS", function ( htmlClass ){
  var root = document.getElementsByTagName('html')[0];
  if (htmlClass) {
    root.setAttribute( "class", htmlClass );
  } else {
    alert("this page has not html class");
    root.setAttribute( "class", "otherPage" );
  }
});

Answer 1

有一种更好的方法可以使用iron-router在html标签上放置类：

Css class in body with Meteor

不能在客户端文件夹中排除css，但是通过将其放在公共文件夹中来实现它是一种肮脏的方法：

Excluding bootstrap from specific routes in Meteor

如何使用Meteor路由页面加载不同的Scss文件

1 个答案: