Skip to content

cache invalidation in the development mode #51

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

Merged
merged 3 commits into from
Nov 28, 2015
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,14 @@ $ npm i css-modules-require-hook

In this section I've tried to cover the common cases of usage.

### Development mode

Usually, Node.js caches all the `require` calls by default. In order to invalidate cache for the purpose of development you should set the environment variable `NODE_ENV` to `development`. For example:

```bash
$ NODE_ENV=development node server.js
```

### Basic example

Basically to attach the require hook you need to require this module. If you need to adjust it see the tuning section below.
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@
"fixture": "webpack",
"start": "esw -w .",
"lint": "eslint .",
"test": "mocha --compilers js:babel/register",
"test": "mocha --compilers js:babel/register --timeout 5000",
"test:cov": "`npm bin`/babel-node `npm bin`/isparta cover --report text --report html `npm bin`/_mocha",
"test:gen": "babel-node generate-tests",
"build": "babel src --out-dir dist",
Expand Down
10 changes: 8 additions & 2 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -67,9 +67,15 @@ function fetch(to, from) {
// https://github.com/postcss/postcss/blob/master/docs/api.md#lazywarnings
lazyResult.warnings().forEach(message => console.warn(message.text));

// updating cache
tokens = lazyResult.root.tokens;
tokensByFile[filename] = tokens;

if (process.env.NODE_ENV !== 'development') {
// updating cache
tokensByFile[filename] = tokens;
} else {
// clearing cache in development mode
delete require.cache[filename];
}

if (postProcess) {
postProcess(lazyResult.css, filename);
Expand Down
57 changes: 57 additions & 0 deletions test/cache.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import { equal } from 'assert';
import { writeFileSync } from 'fs';
import { join } from 'path';
import { dropCache } from '../utils/sugar';
import hook from '../src';

const fixture = join(__dirname, 'fixture/dynamic.css');

function updateFile(content) {
writeFileSync(fixture, content, 'utf8');
}

describe('development mode', () => {
describe('should cache calls not in development mode', () => {
before(() => {
hook();
updateFile('.block\n{\n display: block;\n}');
process.env.NODE_ENV = '';
require(fixture);
updateFile('.inline-block\n{\n display: inline-block;\n}');
});

after(() => {
process.env.NODE_ENV = '';
dropCache(fixture);
});

it('should retrive data from cache', () => {
const tokens = require(fixture);
const keys = Object.keys(tokens);
equal(keys.length, 1);
equal(keys.join(''), 'block');
});
});

describe('should clear cache in development mode', () => {
before(() => {
hook();
updateFile('.block\n{\n display: block;\n}');
process.env.NODE_ENV = 'development';
require(fixture);
updateFile('.inline-block\n{\n display: inline-block;\n}');
});

after(() => {
process.env.NODE_ENV = '';
dropCache(fixture);
});

it('should retrive data from fs', () => {
const tokens = require(fixture);
const keys = Object.keys(tokens);
equal(keys.length, 1);
equal(keys.join(''), 'inline-block');
});
});
});
4 changes: 4 additions & 0 deletions test/fixture/dynamic.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
.inline-block
{
display: inline-block;
}