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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283 |
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
1×
20×
20×
19×
19×
19×
16×
16×
19×
19×
19×
19×
19×
19×
19×
19×
19×
19×
19×
19×
1×
1×
19×
1×
7×
1×
1×
18×
18×
24×
24×
24×
20×
20×
20×
20×
1×
17×
17×
6×
6×
11×
17×
17×
17×
17×
17×
17×
22×
22×
22×
22×
4×
2×
2×
1×
1×
18×
1×
17×
1×
1×
17×
16×
15×
15×
15×
15×
31×
31×
13×
1×
34×
19×
3×
19×
19×
19×
1×
18×
1×
34×
34×
34×
3×
31×
26×
26×
26×
5×
5×
5×
5×
2×
3×
3×
3×
3×
1×
31×
5×
3×
1×
18×
18×
18×
18×
2×
16×
16×
18×
1×
17×
17×
17×
13×
13×
13×
13×
13×
13×
13×
13×
14×
14×
1×
1×
13×
13×
13×
13×
12×
13×
13×
13×
13×
1×
1×
| 'use strict';
var path = require('path');
var fs = require('fs');
var _ = require('lodash');
var resolve = require('resolve');
var debug = require('debug')('vcl-preprocessor');
var whitespace = require('css-whitespace');
// Rework Modules
var rework = require('rework');
var colors = require('rework-plugin-colors');
var references = require('rework-plugin-references');
var ease = require('rework-plugin-ease');
var npmimport = require('rework-npm');
var vars = require('rework-vars');
var clearfix = require('rework-clearfix');
var inherit = require('rework-inherit');
var cmedia = require('rework-custom-media');
var colorFunctions = require('rework-color-function');
var mediaFeatures = require('rework-media-features');
var Processor = function Processor(css, opts) {
opts = opts || {};
if (css === undefined) throw new Error('Got no css input');
if (opts.whitespace !== false) css = whitespace(css); // convert to normal css
var compiler = rework(css, opts);
var npmOptions = {
prefilter: function(css, name) {
if (path.extname(name) === '.styl') css = whitespace(css);
return css;
},
root: opts.root || process.cwd()
};
if (opts.npm !== undefined) _.extend(npmOptions, opts.npm);
compiler.use(npmimport(npmOptions));
compiler.use(vars()); // CSS4 compatible variable support
compiler.use(colors()); // W3C CSS4 Color functions
compiler.use(ease()); // Extra easing functions
compiler.use(inherit()); // Support for the `inherit: ...` construct
compiler.use(references()); // Reference other properties within a css statement
compiler.use(clearfix); // Support for the `clear: fix` construct
compiler.use(cmedia()); // Allows to define custom media types like '--narrow-window'
compiler.use(colorFunctions); // Functions like `rgba(hex, n)`
compiler.use(mediaFeatures(opts)); // Allows to specify (hover: hover) elements
if (opts.namespaceOptions) {
var namespace = require('rework-namespace-css');
compiler.use(namespace(opts.namespaceOptions));
}
return compiler;
};
var createProcessor = function cProcessor(css, opts) {
return new Processor(css, opts);
};
// TODO: move advanced functions to seperate file
var fetchPackage = function(name) {
function fixNoMain(pkg) {
// make all modules require-able
pkg.main = 'package.json';
return pkg;
}
var npmModule = null;
// get module information
debug('fetching %s from %s', name, process.cwd());
// TODO: fix loading relative from other module
var npmModulePath = resolve.sync(name, {
basedir: process.cwd(),
packageFilter: fixNoMain
});
var npmModuleBaseDir = path.dirname(npmModulePath);
npmModule = JSON.parse(fs.readFileSync(npmModulePath, 'utf8'));
npmModule.baseDir = npmModuleBaseDir;
return npmModule;
};
// TODO: clean this up!
// TODO: split into smaller testable functions
var getVclDeps = function(pack, opts) {
var deps = {};
if (opts.includeDevDependencies === true) {
// merge normal & dev dependencies
debug('including dev depdencies');
deps = _.merge(pack.dependencies || {} , pack.devDependencies || {});
} else {
// only normal dependencies
deps = pack.dependencies;
}
pack.vcl = pack.vcl || {};
debug('checking dependencies for %s', pack.name);
var providers = opts.providers || {};
var unorderedDeps = [];
addProvider(pack); // providers from root module
// checking deps for vcl property
_.each(deps, function(version, name) {
debug('%s dependency: %s', pack.name, name);
var npmModule = null;
try {
npmModule = fetchPackage(name);
} catch(e){
if (pack.devDependencies && pack.devDependencies[name] !== undefined){
return debug('module %s not found (skipping - dev depdency)', name);
} else{
if (opts.ignoreMissingDependencies || opts.docGenMode) {
return debug('No file or npm module named ' +
name + ' found in '+ process.cwd());
} else {
throw new Error('No file or npm module named ' +
name + ' found in '+ process.cwd());
}
}
}
if (npmModule.style === undefined && npmModule.vcl === undefined) {
// not a vcl module, skip
return;
}
if (npmModule.vcl === undefined) {
debug('warning: no vcl meta data for ' + npmModule.name);
// patchin
npmModule.vcl = {};
}
// add providers
addProvider(npmModule);
unorderedDeps.push(npmModule);
});
unorderedDeps.push(pack);
// order
debug('== ordering packages ==');
var orderedDeps = [];
// cheap sorting algorithm
_.each(unorderedDeps, function(dep) {
debug('ordering %s', dep.name);
satisfy(dep);
});
return orderedDeps;
function addProvider(npmModule) {
if (npmModule.vcl && npmModule.vcl.provides) {
// allow one string only
if (_.isString(npmModule.vcl.provides)) {
npmModule.vcl.provides = [npmModule.vcl.provides];
}
npmModule.vcl.provides.forEach(function(provides) {
debug('adding provider: %s', provides);
if (providers[provides] !== undefined) {
throw new Error('There can only be one ' + provides + ' provider');
}
providers[provides] = npmModule;
});
}
}
function satisfy(dep) {
var needs = dep.vcl.needs || [];
// allow one string only
if (_.isString(needs)) needs = [needs];
// already in list
if (_.some(orderedDeps, { name: dep.name })) {
return debug('%s already sorted', dep.name);
}
if (isSatisfied(needs)) {
orderedDeps.push(dep);
debug('+ adding %s to ordered list.', dep.name);
return;
} else debug('%s is not satisfied', dep.name);
_.forEach(needs, function(need) {
// get provider
var provider = providers[need];
if (provider === undefined) {
throw new Error('module ' + dep.name +
' needs ' + need + ', but its not provided by any module');
}
satisfy(provider);
// if (_.some(orderedDeps, { name: provider.name })) return;
// debug('+ adding %s to ordered list', provider.name);
// orderedDeps.push(provider);
});
debug('done with depdendencies for %s', dep.name);
orderedDeps.push(dep);
debug('+ adding %s to ordered list', dep.name);
}
function isSatisfied(needs) {
if (needs.length === 0) return true;
if (orderedDeps.length === 0) return false;
return _.includes(orderedDeps, { provides: needs });
}
};
var preProcessPackage = function(pack, opts) {
opts = opts || {};
debug('cwd: %s', process.cwd());
// get the package.json
var npmModule = null;
if (_.isString(pack)) {
npmModule = fetchPackage(pack);
} else {
npmModule = pack;
npmModule.baseDir = process.cwd();
}
if (npmModule.style === undefined) {
throw new Error('npm module "' + npmModule.name +
'" needs a style property in order to be compiled');
}
debug('processing npm package');
var pureCss = [];
var deps = getVclDeps(npmModule, opts);
debug('final list:');
var virtualImport = [];
// fetch the entry css
// TODO: allow plain css
var entryPack = _.remove(deps, { name: npmModule.name })[0];
var entryPath = path.resolve(entryPack.baseDir, entryPack.style);
var entryCss;
Eif (entryPack.style) {
entryCss = fs.readFileSync(entryPath, 'utf8');
}
// finally fetch the css and process it
_.each(deps, function(dep) {
var depPath = path.resolve(dep.baseDir, dep.style);
if (path.extname(depPath) === '.css'){
var depCss = fs.readFileSync(depPath, 'utf8');
return pureCss.push(depCss);
}
debug(dep.name);
virtualImport.push('@import "' + dep.name + '"');
});
// the newline is important!
var everything = virtualImport.join('\n');
if (opts.docGenMode === true) everything += '\n@import "' + npmModule.name + '"';
else everything += '\n' + entryCss;
if (!opts.npm) opts.npm = {};
opts.npm.root = path.dirname(path.resolve(entryPath));
var done = new Processor(everything, opts);
// concat everything and return it
// put the pure css on top (hack?)
return pureCss.join('') + done.toString();
};
module.exports = createProcessor;
module.exports.package = preProcessPackage;
|