前端速学成财:第四课-粗糙的玩一玩css的"编译"

1.读取文件的函数
2.发明个编译CSS的过程

上节课我们模拟了一个所以的”JS编译”,今天的问题是:如果是CSS文件咋办？

我们先新建个test.css

*{color:red}

如果正常引用 那么网页文字全部变成红色.
如果我们按照上节课的思路.require css文件进来 发现会报错的.它会把require进来的文件当前脚本来解析。

那么CSS到底要怎么”编译”呢?
很简单，为了简化思路我们做如下步骤。

1、 如果是js文件，正常的require
2、如果是css文件，则直接读取文件内容
3、然后往编译文件里写个脚本“加入style”

以上只不过是 一个思路借鉴。不要太过于纠结

最后代码:

var getlib=require('sxin');
var getage=require("./bb");
var file=require('fs');

function genCode(key,value)
{
    return 'var '+key+'='+value+';\n';
}

file.writeFile("build.js","");

for(var i=0;i< global.process.mainModule.children.length;i++)
{
    var child=global.process.mainModule.children[i];
    for(var bb in child.exports)// child.exports就是我们导出的属性
        file.appendFile('build.js',genCode(bb,child.exports[bb]));
}

file.readFile('./test.css','utf-8',function(err,data){
    if(err){
    }else{
        file.appendFile('build.js',"document.write('<style>"+data+"</style>')");
    }
})

console.log("生成成功");