Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

the proof of concept about the new plugins API #56

Open
wants to merge 11 commits into
base: master
Choose a base branch
from
49 changes: 5 additions & 44 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,8 @@ function generateShortName (name, filename, css) {
Custom `generateScopedName` function for `postcss-modules-scope`.
Appends a hash of the css source.
*/
function generateLongName (name, filename) {
var sanitisedPath = filename.replace(/\.[^\.\/\\]+$/, '')
function generateLongName (name, filename, css, context) {
var sanitisedPath = path.relative(context, filename).replace(/\.[^\.\/\\]+$/, '')
.replace(/[\W_]+/g, '_')
.replace(/^_|_$/g, '');

Expand Down Expand Up @@ -102,46 +102,7 @@ module.exports = function (browserify, options) {
var cssOutFilename = options.output || options.o;
var jsonOutFilename = options.json || options.jsonOutput;

// PostCSS plugins passed to FileSystemLoader
var plugins = options.use || options.u;
if (!plugins) {
plugins = getDefaultPlugins(options);
}
else {
if (typeof plugins === 'string') {
plugins = [plugins];
}
}

var postcssAfter = options.postcssAfter || options.after || [];
plugins = plugins.concat(postcssAfter);

// load plugins by name (if a string is used)
plugins = plugins.map(function requirePlugin (name) {
// assume functions are already required plugins
if (typeof name === 'function') {
return name;
}

var plugin = require(require.resolve(name));

// custom scoped name generation
if (name === 'postcss-modules-scope') {
options[name] = options[name] || {};
if (!options[name].generateScopedName) {
options[name].generateScopedName = generateLongName;
}
}

if (name in options) {
plugin = plugin(options[name]);
}
else {
plugin = plugin.postcss || plugin();
}

return plugin;
});
var processorOptions = {to: options.to};

// the compiled CSS stream needs to be avalible to the transform,
// but re-created on each bundle call.
Expand All @@ -156,11 +117,11 @@ module.exports = function (browserify, options) {
// collect visited filenames
filenames.push(filename);

var loader = new FileSystemLoader(rootDir, plugins);
var loader = new FileSystemLoader(options, processorOptions);
return through(function noop () {}, function end () {
var self = this;

loader.fetch(path.relative(rootDir, filename), '/').then(function (tokens) {
loader.fetch(filename, filename, null).then(function (tokens) {
var output = 'module.exports = ' + JSON.stringify(tokens);

assign(tokensByFile, loader.tokensByFile);
Expand Down
5 changes: 3 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
"description": "A browserify transform to load CSS Modules",
"main": "index.js",
"dependencies": {
"css-modules-loader-core": "^1.0.0",
"object-assign": "^3.0.0",
"promise-polyfill": "^2.1.0",
"string-hash": "^1.1.0",
Expand All @@ -19,7 +18,9 @@
},
"scripts": {
"test": "tape tests/*.js",
"lint": "eslint index.js tests/"
"lint": "eslint index.js tests/",
"preinstall": "rm -rf node_modules/css-modules-loader-core",
"postinstall": "git clone https://github.com/sullenor/css-modules-loader-core.git node_modules/css-modules-loader-core && cd node_modules/css-modules-loader-core && npm i && npm run build"
},
"author": "joshwnj",
"license": "MIT",
Expand Down
2 changes: 1 addition & 1 deletion tests/cases/compose-node-module/expected.css
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
._cool_styles_styles__foo {
._node_modules_cool_styles_styles__foo {
color: #F00;
}
._styles__foo {
Expand Down