css2js 编译再讨论

[popomore]

Action

• spm-build 增加 install 步骤
• 如果 package.json 不存在 handlebar 则添加默认版本，并 install

---

源文件

// a.css
body {background: none;}

// a.js
require('./a.css');

现在的方案

编译后

define('a.js', ['./a.css'], function(require) {
  require('./a.css');
});
define('a.css', [], function() {
  seajs.importStyle('body {background: none;}');
});

优点

1. importStyle 方法可单独维护，所有模块可用一套
2. 构建工具的约定只是 seajs.importStyle

缺点

1. 使用该模块的时候需要引入 seajs-style 插件，对开发者不透明

最早的方案

编译后

define('a.js', ['./a.css'], function(require) {
  require('./a.css');
});
define('a.css', [], function() {
  function importStyle() {
    return ...
  } 
  importStyle('body {background: none;}');
});

优缺点与上面相反，但这种做法对 importStyle 的维护成本更高，代码维护在构建工具中，需要升级构建工具重新编译。

待讨论的方案

importStyle 为单独模块，编译后

define('a.js', ['./a.css'], function(require) {
  require('./a.css');
});
define('a.css', ['import-style'], function() {
  require('import-style')('body {background: none;}');
});

这种方式和 handlebars 一样

优点

1. import-style 单独维护
2. 构建工具的约定为“当有 css2js 编译时，添加一个 import-style 的模块”
3. 每个模块可依赖不同的 import-style 版本
4. 开发者不需要单独引入插件

缺点

1. 构建工具需要添加一个新的规则

[popomore]

https://github.com/popomore/import-style

[army8735]

实际上和现有方案差不多，一个是插件合并到seajs里，一个作为依赖每次构建进去。

[popomore]

使用该模块的时候需要引入 seajs-style 插件，对开发者不透明

就是这点

[sorrycc]

import-style 需要开发者在 package.json 里手动指定吗?

[popomore]

和 handlebars 一样，需要在 deps 配，如果采用全局方案就 ignore 并配个 alias。

[afc163]

https://github.com/aralejs/autocomplete/blob/master/package.json#L29

这一点极度恶心，很多模块要莫名其妙的配两个用户完全不知道会如何使用的依赖。

[afc163]

感觉这两个依赖都是针对 require 功能的增强，使得可以 require 样式和模板文件。

是不是可以搞两个模块专门用于增强 require： require-handlebars require-css ，然后把 handlebars-runtime 和 import-style 封装在里头。

[popomore]

这两个是啥模块？除非显示的 require 不然都没什么好方法，现在是匹配后缀动态添加依赖的。