自动化构建是现代前端基本都需要的东西,说起这个,大家自然会想到 Glup/Grount这些自动化的构建工具.
当然,本文只是从最最基础的角度,使用Node的fs模块进行了简单的文档的写入操作.
首先,我们先定义一个JSON,用于存放我们想要预先定义的文件夹的内容,比如说,我想要我的文件夹名称为ProjectModule ,里面的文件夹有 css / js / img 还有一个 index.html,同时定义好index文件中的内容
那么我的JSON结构可以这样写
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
| var projectData = {
'name' : 'ProjectModule',
'fileData': [
{
'name': 'css',
'type': 'dir'
},
{
'name': 'js',
'type': 'dir'
},
{
'name': 'img',
'type': 'dir'
},
{
'name': 'index.html',
'type': 'file',
'content': '<html>\n\t<head>\n\t<title>MyProject</title>\n\t</head>\n\t<body>\n\t</body>\n</html>'
}
]
}
|
接下来,就是引入fs模块
因为这里是要实时创建的,我们可以直接使用同步的操作,就省去了异步需要使用回调函数的麻烦
当然,开始之前,要先确定一下,JSON是否有正常的给出文件夹的名称
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
| if(projectData.name) {
fs.mkdirSync(projectData.name)
var fileData = projectData.fileData
fileData.forEach(function(f) {
f.content = f.content? f.content : ''
f.path = projectData.name + '/' + f.name
switch (f.type) {
case 'dir':
fs.mkdirSync(f.path)
break;
case 'file':
fs.writeFileSync(f.path, f.content)
break;
default:
break;
}
})
}
|
如果使用的是webstorm, 那么直接使用ctrl+f9, 让你的node程序跑起来吧~
