整理原始CSS代码的小工具

从网页上F12看到的链接，所对应的CSS代码是不是杂乱无章，让你无从下手呢。这个小工具可以帮你把你要一个一个回车才能很好看清的代码瞬间变得整洁无比，让你一眼就找到你的class

1.效果：

整理前：

原始CSS.png

整理后：

整理后.png

2.使用工具：node

3.原理：遇到 } 就换行

4.代码：

//betterFile.js
var fs=require("fs");
var data=fs.readFileSync('test.css');
var txt=data.toString();
txt=txt.replace(/\}/g,'}\n');
fs.writeFile('test.css',txt,function(err){
  if(err){
    return console.log(err);
  }
  console.log('写入成功！');
});

5.使用方法

• 新建一个文件夹(test)，新建js文件（betterFile.js），将代码拷贝至js文件中

• 将需要修正的CSS文件（test.css）放入文件夹中

• 改写代码：将第三行，第六行的“test.css”改成你的CSS文件名字

• 运行node :

cd 文件夹路径
node betterFile.js

操作.png