蘑菇小姐会开花

seajs 遇到的问题

遇到的问题

嗯,又遇到问题了,也不是第一次遇到这个问题了,之前都没意识到是哪里不对,就忽略了这个问题,现在第二次遇到就去查了一下,大概是这样,在源文件中一切正常,用grunt构建以后的文件会出现下图的报错,我想应该是seajs管理依赖出了点问题。
bugs
我的文件路径大概是这样:

1
2
3
4
5
6
7
├──plugins/
│ │──shunde/
│ │ │──js/
│ └── └──index.html
├───statics/
├───modules/
└───config.js

我的配置文件是这样:

1
2
3
4
5
6
7
8
9
10
11
seajs.config({
base: './js/',
alias: {
'Handlebars': '../../../statics/scripts/handlebars.min.js',
'config': '../../../config.js'
},
map: [
['.js', '.js?v=@@version']
]
});
seajs.use('./js/register');

我的register.js文件中这样引入了util.js,报错的parseForm函数就定义在util.js文件中:

1
var util = require('../../../modules/base/util');

报错的原因应该是util.js文件引入失败。

ID和路径匹配原则

所谓ID和路径匹配原则是指,使用seajs.userequire进行引用的文件,如果是具名模块(即定义了ID的模块),会把ID和seajs.use的路径名进行匹配,如果一致,则正确执行模块返回结果。反之,则返回null。
Sea.js 的模块启动接口秉承的是路径即 ID 的设计原则。seajs.use 的方法的第一个参数被规定为文件路径(而不是 ID),可以通过 alias 来帮助 ID 匹配上最终的路径。
在进行路径解析的时候require('../../../modules/base/util'),首先判断seajs.config是否定义了该alias,如果存在则替换;在这之后再根据base,将id值解析为url;最后进行map解析。

解决方法

  1. 在alias中新增util的定义

    修改配置文件

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    seajs.config({
    base: "./js/",
    alias: {
    "Handlebars": '../../../statics/scripts/handlebars.min.js',
    'config': '../../../config',
    'util': '../../../modules/base/util'
    },
    map: [
    ['.js', '.js?v=@@version']
    ]
    });
    seajs.use('./js/register');

    修改register.js文件

    1
    var util = require('util');
  2. 修改base路径

    修改配置文件

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    seajs.config({
    base: "../../modules",
    alias: {
    "Handlebars": '../../../statics/scripts/handlebars.min.js',
    'config': '../../../config',
    'util': '../../../modules/base/util'
    },
    map: [
    ['.js', '.js?v=@@version']
    ]
    });
    seajs.use('./js/register');

参考文章

https://github.com/seajs/seajs/issues/930

坚持原创技术分享,您的支持将鼓励我继续创作!