使用grunt构建seajs项目遇到的各种坑

[TOC]

使用grunt-cmd-transport转换为具名模块遇到的问题

1. 最新版本依赖不能完全提取

grunt-cmd-transport 最新版本0.5.1不能完全提取依赖，需要降级到0.4.1。

参考：

2. 转换后出新双反斜杠

同样需要降级到0.4.1才行。

参考：

3. 会将深层次的依赖也提取到deps中

网上解决方法，不要配置paths，然后用--force强制执行。

但是如果所有require都用相对路径，也就是都以.开头，就不需要强制执行了。 transport后所有依赖包括间接依赖都会提取到deps中。这样在concat的时候就不会出现模块重复或者漏掉模块的情况。

所以为了避免concat出现问题，require一定要用相对路径，concat设置include为relative

参考：

4. 模板文件的问题

不管是html还是tpl，不要做成js文件。模板文件就放html代码即可。如果是.js文件，那么生成的debug文件与require会不一致(debug一个在前一个在后)。因为.js文件是以script.jsParser处理的而不是text.html2jsParser或者template.tplParser处理。

var transport = require('grunt-cmd-transport');var style = transport.style.init(grunt);var text = transport.text.init(grunt);var script = transport.script.init(grunt);transport: {	options: {		debug : true,	    parsers : {	         '.js' : [script.jsParser],	         '.css' : [style.css2jsParser],	         '.html' : [text.html2jsParser]	     }    },}

5. css文件的问题

css文件在transport的时候可以用style.css2jsParser或者style.cssParser。前者转换为.js文件或者还是css文件只是会带上/*! define 模块id */一行这样的注释。

但是如果在require用的是相对路径，那么concat的时候就会去找js文件，而require用的是绝对路径，那么concat的时候就会去找css文件。

生成的js文件是seajs.importStyle格式的，所以入口页面还需要引入seajs-style.js

参考：

使用grunt-cmd-concat合并模块

• concat设置include为relative，设置all时合并会出现重复
• 如果css文件还没有transport则需要设置css2js: require('grunt-cmd-transport').style.css2js，这时候require的时候就不能用相对路径

参考：