RequireJS没有加载正确的路径

时间:2015-03-24 15:31:44

标签: jquery requirejs grunt-contrib-requirejs

我正在尝试将requirejs改装成一个项目,我间歇地在文件上找到“404 Not Found”。

每次,大致,3或4次重新加载我都会收到以下错误

GET http://localhost:8080/build/jquery.js 
Uncaught Error: Script error for: jquery

GET http://localhost:8080/build/touchSwipe.js
Uncaught Error: Script error for: touchSwipe

我的文件如下:

config.js

require.config({
    paths: {
        'jquery': 'vendor/jquery',
        'touchSwipe': 'vendor/jquery.touchSwipe.min',
        'scripts': 'scripts/'
    },
    shim: {
        'touchSwipe': {
            deps: ['jquery']
        }
    }
});
require(['main']);

main.js

require(
    ['scripts/menu', 
    .. more js files .. ]);

我使用grunt-contrib-requirejs来优化文件,而且一切似乎都运行正常

Gruntfile.js

requirejs: {
    compile: {
        options: {
            baseUrl: "path/to/file/",
            mainConfigFile: "path/to/file/config.js",
            dir: 'path/to/build/',
            modules: [
                {
                    name: 'main'
                },
            ],
            uglify: {
                no_mangle: true
            },
        }
    }
}

...只是填写空白,我的main.hbs文件有这个脚本标记

<script data-main="/build/config" src="/js/vendor/require.js"></script>

正如我所说,在我尝试引入更多模块之前,这一切都正常。我只想在某些页面上加载的模块。

我尝试通过在相关页面的末尾添加以下代码来实现此目的

<script type="text/javascript">
    require(['scripts/page1']);
</script>

page1.js文件看起来像......

define(['jquery', 'touchSwipe'], function ($j) {
    ...
});

当这些错误没有出现时,该网站似乎工作正常。另一件需要注意的事情是,当我通过Grunt任务运行代码时,这似乎只有。

问题在于,错误中的网址是错误的。 jQuery应该在/ build / vendor /而不是/ build /中找到,而touchSwipe是我为库定义的路径。这看起来像是一个时间问题;在新文件之后加载配置。

1 个答案:

答案 0 :(得分:0)

我想通了

我需要在模块下指定Grunt中的文件,如此

modules: [
    //First set up the common build layer.
    {
        //module names are relative to baseUrl
        name: 'config',
        include: [
            'jquery',
            'touchSwipe',
            'jquery-ui',
            'modernizr'
        ]
    },
    {
      name: 'scripts/page1',
      exclude: ['config']
    }
],

然后我没有将配置文件添加到脚本标签中,而是执行了此操作

require(['./build/config'], function () {  
    require(['scripts/page1']);
});

我加了

baseUrl: "build"

到我的配置文件,这似乎已经成功了