Question

我有以下结构：

components/
----requirejs
----require-css
----flatUi
--------/css
------------flat.css
menuJSlib/
----js/
--------menu.js
----css/
--------menu.css
samples
----demo/
--------js/
------------main.js
--------css/
------------main.css
--------index.html

我尝试在我的演示项目中使用requirejs和require-css加载文件夹menuJSlib中的所有内容。在我的demo.html中的index.html中，我包含了requirejs库。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title></title>

  </head>
  <body>

    <script data-main="js/main" src="../../components/requirejs/require.js"></script>
  </body>
</html>

在我的演示项目的main.js文件中，我有以下代码：

require.config({
  baseUrl: './../../',

  map: {
    '*': {
      'css': 'components/require-css/css'
    }
  },
  paths: {
    GameMenu: 'lib/js/menu',
    'layout': 'samples/requirejs_demo/css/main'
  }
});

require(['GameMenu', 'css!layout'], function(GameMenu) {

}

menuJSlib文件夹中menu.js中的代码是：

 define('GameMenu', ['css!components/flat-ui/dist/css/flat-ui.min.css',
                        'css!lib/css/main.css'], function() {
      return GameMenu;
    });

如何看待menu.js与css文件的依赖关系。好吧，所有这些东西都运行正常，但问题是我可以找到一种方法来订购css文件，在这种情况下依赖于依赖项。

enter image description here

正如你所看到的，我尝试下订单，这取决于menu.js，然后在demo文件夹中加载main.css。这样，demo中的main.css将包含一些我需要的css规则。但顺序消失如下：

demo/css/main.css
flatui/css/flat.css
menuJslib/css/main.css

我不打算做这个顺序，而不删除menu.js中的css依赖项

flatui/css/flat.css
menuJslib/css/main.css
demo/css/main.css

在这种情况下这是可行的吗？

需要按特定顺序使用require-css.js的css文件

0 个答案: