phpstudy集成环境

 首页 > requirejs的config中，关于paths的疑问

requirejs的config中，关于paths的疑问

接触requirejs不久，有一个疑问：

官方例子：https://github.com/requirejs/example-multipage-shim

其中有如下代码：

requirejs.config({
    baseUrl: 'js/lib',
    paths: {
        app: '../app' // 这是我疑惑的地方
    },
    shim: {
        backbone: {
            deps: ['jquery', 'underscore'],
            exports: 'Backbone'
        },
        underscore: {
            exports: '_'
        }
    }
});

app: '../app'，项目中只有app这个文件夹，而没有app.js，由此可知config配置中paths可以直接指定文件夹，那么如何判断指定的是包含js文件的文件夹还是js文件呢？我在自己的项目中直接指定文件夹就会出现没有找到相应模块的错误。

path的配置内容主要有两个作用

模块路径

假如我的项目结构是这样的：

index.html

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<script>
    var require = {
        baseUrl: 'js',
        paths: {
            underscore:'lib/underscore'
        }
    }
</script>
<script src="js/lib/require.js" data-main="my/inner/a"></script>
</body>
</html>

#a.js
define(function (require) {
    var _ = require('underscore');

    console.log(_);
});

通过配置path，可以减少我们的如require('underscore')的代码量。

路径替换

使用data-main的时候，可以替换路径：

#index,html
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<script>
    var require = {
        baseUrl: 'js',
        paths: {
            underscore:'lib/underscore',
            app:'my/inner'
        }
    }
</script>
<script src="js/lib/require.js" data-main="app/a"></script>
</body>
</html>

#a.js
define(function (require) {
    var _ = require('underscore');

    console.log(_);
});

说到底，path里的配置就是个占位符，最后都会相对于baseUrl去寻找js文件。

【热门文章】
【热门文章】