3

美好的一天，我正在尝试使用CurlJS，并且在大多数项目上都取得了成功。但是，由于某种原因，我仍然无法使用CurlJS加载 CSS 文件。

Firebug（网络选项卡）显示他们的css.js插件正在加载：我假设它用于加载 CSS 文件。Firebug（控制台选项卡）显示来自curl.js文件内的“a.load 不是函数”。

版本号为define.amd.curl：“0.6.2”

我的问题是：为什么没有加载 CSS 文件？

我的代码看起来像：

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>

    <script type="text/javascript">
        curl =
        {
            baseUrl: '.',
            paths:
                {
                    curl: 'Scripts/Curl'
                    //,'css!':'Style' //<-- I even tried this with no success
                },
            pluginPath: 'Scripts/Curl/curl/plugin'
        };
    </script>

    <script src="Scripts/Curl/curl.js" type="text/javascript"></script>

    <script type="text/javascript">
        curl(['css!Style/Test.css'])
            .then(
            function (css) {
                if (css)
                    alert("It Works!");
            },
            function (error) {
                alert("It failed!");
            });
    </script>

</head>
<body>
    <form id="form1" runat="server">
        <div class="test" style="border: 1px solid black; text-align: center; width: 400px;">
            If the CSS loads this text will be RED.
        </div>
    </form>
</body>
</html>

控制台标签：
这是 Firebugs 控制台的屏幕截图

网络标签：
这是 Firebugs Net 的截图

更新：
我“可以”使用以下 JavaScript 加载给定模块的 CSS 依赖项，但我更愿意使用 Curls 原生功能。

var head = document.getElementsByTagName('head')[0];
var files = ['/Style/Test.css']; //<-- my list of files
for (var i = 0, l = files.length; i < l; i++) {
    var link = document.createElement('link');
    link.href = files[i];
    link.rel = "stylesheet";
    link.type = "text/css";
    head.appendChild(link);
}
4

3 回答 3

1

我发现您的代码段存在一些问题：

  1. 成功回调的签名有两个参数（$，css），但您只需要一个模块“Test.css”。
  2. 不要尝试通过脚本元素加载模块。那是行不通的。

鉴于显示的代码片段，我无法解释“a.load 不是函数”消息。一定有其他我看不到的事情正在发生。

[更新您发布屏幕截图后：] Firebug 屏幕截图中显示的一小段代码看起来像是 css.js 文件已被最小化/压缩。它并不是要单独最小化。使用 curl 的 make 实用程序来构建带有 css 的 curl 版本！插件烘焙，或者在 curl/dist 中获取已经烘焙到 css 中的版本！插件模块。那应该可以解决问题。

于 2012-04-16T20:41:56.763 回答
0

我不熟悉 CurlJS，但它可能与 CSS 文件的相对路径有关。

尝试更换：

curl(['css!Style/Test.css'])

与：

curl(['css!./Style/Test.css'])

或者：

curl(['css!../../Style/Test.css'])
于 2012-04-16T13:41:16.920 回答
0

使用另一个 curl.js 文件... kitchen-sink 版本包含插件，其他版本不包含。

https://github.com/cujojs/curl/tree/master/dist/curl-kitchen-sink

于 2012-09-14T20:05:27.850 回答