Skip to content

Commit 4507729

Browse files
author
Joel Denning
authored
Initial implementation (#1)
* Initial implementation * Documentation * Workflow * Console log
1 parent 9599aa7 commit 4507729

File tree

12 files changed

+2573
-1
lines changed

12 files changed

+2573
-1
lines changed

.babelrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{}

.eslintrc

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"extends": "node-important-stuff",
3+
"parser": "@babel/eslint-parser",
4+
"rules": {
5+
"node/no-unsupported-features/es-syntax": "off"
6+
}
7+
}
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
on:
2+
- push
3+
- pull_request
4+
5+
jobs:
6+
build-test:
7+
runs-on: ubuntu-latest
8+
steps:
9+
- uses: actions/checkout@v2
10+
- uses: pnpm/action-setup@v2.0.1
11+
with:
12+
version: 6.11.5
13+
run_install: |
14+
- recursive: true
15+
args: [--frozen-lockfile, --strict-peer-dependencies]
16+
- run: pnpm run lint
17+
- run: pnpm run test

.husky/pre-commit

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
#!/bin/sh
2+
. "$(dirname "$0")/_/husky.sh"
3+
4+
pnpm run lint && pnpm exec pretty-quick --staged

README.md

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,29 @@
1-
# node-loader-postcss
1+
# @node-loader/postcss
2+
3+
A [nodejs loader](https://nodejs.org/dist/latest-v13.x/docs/api/esm.html#esm_experimental_loaders) for [postcss](https://postcss.org/). This allows you to load CSS files into NodeJS programs by converting them into Javascript modules. The returned ES module has a `default` property whose value is the compiled CSS string.
4+
5+
## Installation
6+
7+
```sh
8+
npm install --save @node-loader/postcss
9+
```
10+
11+
## Usage
12+
13+
Now run node with the `--loader` (or `--experimental-loader` for older NodeJS version) flag:
14+
15+
```sh
16+
node --loader @node-loader/postcss file.js
17+
```
18+
19+
## Configuration
20+
21+
By default, node-loader postcss looks for a configuration file called `postcss.config.js` in the current working directory. To specify the file path to the configuration file, provide the `POSTCSS_CONFIG` environment variable:
22+
23+
```sh
24+
POSTCSS_CONFIG=/Users/name/some/dir/.postcssrc node --loader @node-loader/postcss file.js
25+
```
26+
27+
## Composition
28+
29+
If you wish to combine postcss loading with other NodeJS loaders, you may do so by using [node-loader-core](https://github.com/node-loader/node-loader-core).

lib/node-loader-postcss.js

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
import postcss from "postcss";
2+
import path from "path";
3+
4+
export async function transformSource(
5+
originalSource,
6+
context,
7+
defaultTransformSource
8+
) {
9+
if (useLoader(context.url)) {
10+
const postCssConfigFilePath = path.resolve(
11+
process.cwd(),
12+
process.env.POSTCSS_CONFIG || "postcss.config.js"
13+
);
14+
15+
const { default: postCssConfig } = await import(postCssConfigFilePath);
16+
let css;
17+
try {
18+
const result = await postcss(postCssConfig.plugins).process(
19+
originalSource.toString(),
20+
{
21+
from: context.url,
22+
to: context.url,
23+
}
24+
);
25+
26+
css = result.css;
27+
} catch (err) {
28+
console.error("@node-loader/postcss: PostCSS compilation error");
29+
console.error(err);
30+
throw err;
31+
}
32+
33+
const source =
34+
"export default `" +
35+
css.replace(/\\/g, "\\\\").replace(/`/g, "\\`") +
36+
"`";
37+
38+
return {
39+
source,
40+
};
41+
}
42+
43+
return defaultTransformSource(
44+
originalSource,
45+
context,
46+
defaultTransformSource
47+
);
48+
}
49+
50+
export function getFormat(url, context, defaultGetFormat) {
51+
if (useLoader(url)) {
52+
return {
53+
format: "module",
54+
};
55+
} else {
56+
return defaultGetFormat(url, context, defaultGetFormat);
57+
}
58+
}
59+
60+
function useLoader(url) {
61+
return url.endsWith(".css");
62+
}

package.json

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
{
2+
"name": "@node-loader/postcss",
3+
"version": "1.0.0",
4+
"description": "A NodeJS loader for processing PostCSS ",
5+
"type": "module",
6+
"main": "lib/node-loader-postcss.js",
7+
"scripts": {
8+
"test": "node --loader ./lib/node-loader-postcss.js ./test/run-tests.js",
9+
"lint": "eslint lib",
10+
"prepare": "husky install"
11+
},
12+
"files": [
13+
"lib"
14+
],
15+
"engines": {
16+
"node": ">=14"
17+
},
18+
"repository": {
19+
"type": "git",
20+
"url": "git+https://github.com/node-loader/node-loader-postcss.git"
21+
},
22+
"keywords": [
23+
"node",
24+
"loader",
25+
"postcss"
26+
],
27+
"author": "Joel Denning",
28+
"license": "MIT",
29+
"bugs": {
30+
"url": "https://github.com/node-loader/node-loader-postcss/issues"
31+
},
32+
"homepage": "https://github.com/node-loader/node-loader-postcss#readme",
33+
"dependencies": {
34+
"postcss": "^8.3.6"
35+
},
36+
"devDependencies": {
37+
"@babel/core": "^7.14.8",
38+
"@babel/eslint-parser": "^7.14.9",
39+
"autoprefixer": "^10.3.1",
40+
"eslint": "^7.32.0",
41+
"eslint-config-node-important-stuff": "^1.1.0",
42+
"husky": "^7.0.0",
43+
"mocha": "^9.0.3",
44+
"prettier": "^2.3.2",
45+
"pretty-quick": "^3.1.1"
46+
}
47+
}

0 commit comments

Comments
 (0)