Skip to content
Permalink
Browse files

feat: support supressing empty CSS files in rollup plugin (#569)

Allows for disabling output of empty files, since sometimes that's not what you want.

Also adding docs for the feature.
  • Loading branch information...
tivac committed Mar 20, 2019
1 parent be57edd commit f9240a3ee2f33eb321de8d2f0a04fde601ae15e1

Large diffs are not rendered by default.

Oops, something went wrong.
@@ -27,25 +27,26 @@
"@tivac/eslint-config": "^2.3.1",
"browserify": "^16.2.3",
"cli-tester": "2.0.0",
"cssnano": "^4.1.10",
"dedent": "0.7.0",
"dentist": "1.0.3",
"env-cmd": "^8.0.2",
"eslint": "^5.15.1",
"eslint-plugin-jest": "^22.3.0",
"eslint": "^5.15.3",
"eslint-plugin-jest": "^22.4.1",
"factor-bundle": "2.5.0",
"from2-string": "1.1.0",
"jest": "^24.1.0",
"jest-cli": "^24.1.0",
"jest": "^24.5.0",
"jest-cli": "^24.5.0",
"jest-runner-eslint": "^0.7.3",
"lerna": "^3.13.1",
"pegjs": "0.10.0",
"read-dir-deep": "^4.0.2",
"rollup": "^1.5.0",
"rollup": "^1.7.0",
"rollup-plugin-svelte": "^5.0.3",
"shelljs": "^0.8.3",
"sugarss": "^2.0.0",
"svelte": "^2.16.1",
"watchify": "3.11.0",
"watchify": "^3.11.1",
"webpack": "^4.29.6"
},
"dependencies": {
@@ -28,6 +28,7 @@ module.exports = (opts) => {
namedExports : true,
styleExport : false,
verbose : false,
empties : true,

// Regexp to work around https://github.com/rollup/rollup-pluginutils/issues/39
include : /\.css$/i,
@@ -214,6 +215,9 @@ module.exports = (opts) => {
// Track specified name -> output name for writing out metadata later
const names = new Map();

// Track chunks that don't actually need to be output
const duds = new Set();

for(const node of chunked.overallOrder()) {
// Only want to deal with CSS currently
if(entries.has(node)) {
@@ -223,8 +227,6 @@ module.exports = (opts) => {
const ext = ".css";
const name = path.basename(node, path.extname(node));

const id = this.emitAsset(`${name}${ext}`);

/* eslint-disable-next-line no-await-in-loop */
const result = await processor.output({
// Can't use this.getAssetFileName() here, because the source hasn't been set yet
@@ -235,8 +237,14 @@ module.exports = (opts) => {
files : graph.getNodeData(node),
});


this.setAssetSource(id, result.css);
// Don't output empty files if empties is falsey
if(!options.empties && !result.css.length) {
duds.add(node);

continue;
}

const id = this.emitAsset(`${name}${ext}`, result.css);

// Save off the final name of this asset for later use
const dest = this.getAssetFileName(id);
@@ -290,8 +298,10 @@ module.exports = (opts) => {

// Attach info about this asset to the bundle
const { assets = [] } = chunk;

chunked.dependenciesOf(entry).forEach((dep) => assets.push(names.get(dep)));

chunked.dependenciesOf(entry)
.filter((dep) => !duds.has(dep))
.forEach((dep) => assets.push(names.get(dep)));

chunk.assets = assets;

@@ -510,6 +510,8 @@ Array [
]
`;

exports[`/rollup.js should write out empty CSS files by default 1`] = `""`;

exports[`/rollup.js shouldn't disable sourcemap generation 1`] = `
SourceMap {
"file": "simple.js",
@@ -5,6 +5,7 @@ const { rollup } = require("rollup");

const dedent = require("dedent");
const shell = require("shelljs");
const cssnano = require("cssnano");

const read = require("@modular-css/test-utils/read.js")(__dirname);
const readdir = require("@modular-css/test-utils/read-dir.js")(__dirname);
@@ -595,6 +596,56 @@ describe("/rollup.js", () => {
expect(result).toMatchRollupSnapshot();
});

it("should write out empty CSS files by default", async () => {
const bundle = await rollup({
input : require.resolve("./specimens/empty.js"),
plugins : [
plugin({
namer,
map,

done : [
cssnano(),
],
}),
],
});

await bundle.write({
format,
assetFileNames,
file : prefix(`./output/empty-css/empty.js`),
});

expect(read("./empty-css/assets/empty.css")).toMatchSnapshot();
});

it("should not write out empty CSS files when empties is falsey", async () => {
const bundle = await rollup({
input : require.resolve("./specimens/empty.js"),
plugins : [
plugin({
namer,
map,
empties : false,

done : [
cssnano(),
],
}),
],
});

await bundle.write({
format,
assetFileNames,
file : prefix(`./output/no-empty-css/empty.js`),
});

expect(exists("./output/no-empty-css/assets/empty.css")).toBe(false);
});


describe("case sensitivity tests", () => {
const fs = require("fs");
let fn = it;
No changes.
@@ -0,0 +1,3 @@
import css from "./empty.css";

console.log(css);
@@ -86,6 +86,10 @@ Enable `styleExport` will also disable the plugin from emitting any assets as we

Pass an already-instantiated `Processor` instance to the rollup plugin. It will then add any files found when traversing the modules to it and both the rollup-discovered and any already-existing files will be output in the final CSS.

##### `empties`

Set to a falsey value to disable outputting of empty CSS files. This is most common when a file contains only `@value`s and then a minifier is used which strips out the file heading comments. Defaults to `true`.

##### Shared Options

All other options are passed to the underlying `Processor` instance, see the [Processor Options](#processor-options).

0 comments on commit f9240a3

Please sign in to comment.
You can’t perform that action at this time.