Skip to content

fix module resolution #1080

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
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
3 changes: 3 additions & 0 deletions plugins/postcss-design-tokens/.tape.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -94,6 +94,9 @@ postcssTape(plugin)({
message: "supports value parsing (G)",
warnings: 2
},
'imported-double-slash': {
message: "supports 'node_modules://'",
},
'examples/example': {
message: 'minimal example',
options: {},
Expand Down
5 changes: 5 additions & 0 deletions plugins/postcss-design-tokens/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,10 @@
# Changes to PostCSS Design Tokens

### Unreleased (minor)

- Add support for the shorter `node_modules:package` syntax
- Fix node module resolution

### 3.0.1

_July 24, 2023_
Expand Down
4 changes: 2 additions & 2 deletions plugins/postcss-design-tokens/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -321,8 +321,8 @@ The `@design-tokens` rule is used to import design tokens from a JSON file into
You can also import tokens from an `npm` package:

```pcss
@design-tokens url('node_modules://my-npm-package/tokens.json') format('style-dictionary3');
@design-tokens url('node_modules://my-npm-package/tokens-dark-mode.json') format('style-dictionary3') when('dark');
@design-tokens url('node_modules:my-npm-package/tokens.json') format('style-dictionary3');
@design-tokens url('node_modules:my-npm-package/tokens-dark-mode.json') format('style-dictionary3') when('dark');
```

```
Expand Down
2 changes: 1 addition & 1 deletion plugins/postcss-design-tokens/dist/index.cjs

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion plugins/postcss-design-tokens/dist/index.mjs

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions plugins/postcss-design-tokens/docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -190,8 +190,8 @@ The `@design-tokens` rule is used to import design tokens from a JSON file into
You can also import tokens from an `npm` package:

```pcss
@design-tokens url('node_modules://my-npm-package/tokens.json') format('style-dictionary3');
@design-tokens url('node_modules://my-npm-package/tokens-dark-mode.json') format('style-dictionary3') when('dark');
@design-tokens url('node_modules:my-npm-package/tokens.json') format('style-dictionary3');
@design-tokens url('node_modules:my-npm-package/tokens-dark-mode.json') format('style-dictionary3') when('dark');
```

```
Expand Down
27 changes: 14 additions & 13 deletions plugins/postcss-design-tokens/src/data-formats/parse-import.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,6 @@ import { DEFAULT_CONDITION } from '../constants';
import module from 'module';
import type { Helpers, Root } from 'postcss';

const require = module.createRequire(import.meta.url);

function parseImport(statement: string): { filePath: string, format: string, conditions: Array<string> } {
const importAST = valueParser(statement);

Expand Down Expand Up @@ -48,18 +46,21 @@ export async function tokensFromImport(root: Root, postcssHelpers: Helpers, buil
}

let resolvedPath = '';
if (filePath.startsWith('node_modules://')) {
try {
resolvedPath = require.resolve(filePath.slice(15), {
paths: [
path.dirname(sourceFilePath),
],
});
} catch (e) {
throw new Error(`Failed to read ${filePath} with error ${(e as Error).message}`);

try {
if (filePath.startsWith('node_modules://')) {
const require = module.createRequire(path.dirname(sourceFilePath));

resolvedPath = require.resolve(filePath.slice(15));
} else if (filePath.startsWith('node_modules:')) {
const require = module.createRequire(path.dirname(sourceFilePath));

resolvedPath = require.resolve(filePath.slice(13));
} else {
resolvedPath = path.resolve(path.dirname(sourceFilePath), filePath);
}
} else {
resolvedPath = path.resolve(path.dirname(sourceFilePath), filePath);
} catch (e) {
throw new Error(`Failed to read ${filePath} with error ${(e as Error).message}`);
}

if (alreadyImported.has(resolvedPath)) {
Expand Down
5 changes: 5 additions & 0 deletions plugins/postcss-design-tokens/test/imported-double-slash.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
@design-tokens url(node_modules://style-dictionary-design-tokens-example/style-dictionary.tokens.json) format('style-dictionary3');

.foo {
color: design-token('color.font.base');
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.foo {
color: #111111;
}
2 changes: 1 addition & 1 deletion plugins/postcss-design-tokens/test/imported.css
Original file line number Diff line number Diff line change
@@ -1 +1 @@
@design-tokens url(node_modules://style-dictionary-design-tokens-example/style-dictionary.tokens.json) format('style-dictionary3');
@design-tokens url(node_modules:style-dictionary-design-tokens-example/style-dictionary.tokens.json) format('style-dictionary3');
2 changes: 1 addition & 1 deletion plugins/postcss-global-data/.tape.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ postcssTape(plugin)({
plugins: [
plugin({
files: [
'node_modules://open-props/media.min.css',
'node_modules:open-props/media.min.css',
'node_modules://open-props/open-props.min.css',
]
}),
Expand Down
5 changes: 5 additions & 0 deletions plugins/postcss-global-data/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,10 @@
# Changes to PostCSS global-data

### Unreleased (minor)

- Add support for the shorter `node_modules:package` syntax
- Fix node module resolution

### 2.0.1

_July 24, 2023_
Expand Down
2 changes: 1 addition & 1 deletion plugins/postcss-global-data/dist/index.cjs
Original file line number Diff line number Diff line change
@@ -1 +1 @@
"use strict";var e=require("path"),r=require("fs");const t=require("module").createRequire("undefined"==typeof document?require("url").pathToFileURL(__filename).href:document.currentScript&&document.currentScript.src||new URL("index.cjs",document.baseURI).href);function parseImport(s,n,o,a){var c;let i="";if(o.startsWith("node_modules://"))try{i=t.resolve(o.slice(15),{paths:[e.dirname(o)]})}catch(e){throw new Error(`Failed to read ${o} with error ${e.message}`)}else i=e.resolve(o);if(a.has(i))return!1;a.add(i),n.result.messages.push({type:"dependency",plugin:"postcss-global-data",file:i,parent:null==(c=s.source)||null==(c=c.input)?void 0:c.file});const u=r.readFileSync(i,"utf8");return n.postcss.parse(u,{from:i})}const creator=e=>{const r=Object.assign({files:[]},e);return{postcssPlugin:"postcss-global-data",prepare(){let e=new Set,t=new Set;return{Once:(s,n)=>{r.files.forEach((r=>{if(e.has(r))return;const o=parseImport(s,n,r,e);o&&o.each((e=>{s.append(e),t.add(e)}))}))},OnceExit:()=>{t.forEach((e=>{e.remove()})),t=new Set,e=new Set}}}}};creator.postcss=!0,module.exports=creator;
"use strict";var e=require("path"),s=require("fs"),r=require("module");function parseImport(t,o,a,n){var c;let l="";try{if(a.startsWith("node_modules://")){l=r.createRequire(process.cwd()).resolve(a.slice(15))}else if(a.startsWith("node_modules:")){l=r.createRequire(process.cwd()).resolve(a.slice(13))}else l=e.resolve(a)}catch(e){throw new Error(`Failed to read ${a} with error ${e.message}`)}if(n.has(l))return!1;n.add(l),o.result.messages.push({type:"dependency",plugin:"postcss-global-data",file:l,parent:null==(c=t.source)||null==(c=c.input)?void 0:c.file});const i=s.readFileSync(l,"utf8");return o.postcss.parse(i,{from:l})}const creator=e=>{const s=Object.assign({files:[]},e);return{postcssPlugin:"postcss-global-data",prepare(){let e=new Set,r=new Set;return{Once:(t,o)=>{s.files.forEach((s=>{if(e.has(s))return;const a=parseImport(t,o,s,e);a&&a.each((e=>{t.append(e),r.add(e)}))}))},OnceExit:()=>{r.forEach((e=>{e.remove()})),r=new Set,e=new Set}}}}};creator.postcss=!0,module.exports=creator;
2 changes: 1 addition & 1 deletion plugins/postcss-global-data/dist/index.mjs
Original file line number Diff line number Diff line change
@@ -1 +1 @@
import e from"path";import t from"fs";import r from"module";const s=r.createRequire(import.meta.url);function parseImport(r,o,a,n){var l;let p="";if(a.startsWith("node_modules://"))try{p=s.resolve(a.slice(15),{paths:[e.dirname(a)]})}catch(e){throw new Error(`Failed to read ${a} with error ${e.message}`)}else p=e.resolve(a);if(n.has(p))return!1;n.add(p),o.result.messages.push({type:"dependency",plugin:"postcss-global-data",file:p,parent:null==(l=r.source)||null==(l=l.input)?void 0:l.file});const i=t.readFileSync(p,"utf8");return o.postcss.parse(i,{from:p})}const creator=e=>{const t=Object.assign({files:[]},e);return{postcssPlugin:"postcss-global-data",prepare(){let e=new Set,r=new Set;return{Once:(s,o)=>{t.files.forEach((t=>{if(e.has(t))return;const a=parseImport(s,o,t,e);a&&a.each((e=>{s.append(e),r.add(e)}))}))},OnceExit:()=>{r.forEach((e=>{e.remove()})),r=new Set,e=new Set}}}}};creator.postcss=!0;export{creator as default};
import e from"path";import s from"fs";import r from"module";function parseImport(t,o,a,n){var l;let c="";try{if(a.startsWith("node_modules://")){c=r.createRequire(process.cwd()).resolve(a.slice(15))}else if(a.startsWith("node_modules:")){c=r.createRequire(process.cwd()).resolve(a.slice(13))}else c=e.resolve(a)}catch(e){throw new Error(`Failed to read ${a} with error ${e.message}`)}if(n.has(c))return!1;n.add(c),o.result.messages.push({type:"dependency",plugin:"postcss-global-data",file:c,parent:null==(l=t.source)||null==(l=l.input)?void 0:l.file});const i=s.readFileSync(c,"utf8");return o.postcss.parse(i,{from:c})}const creator=e=>{const s=Object.assign({files:[]},e);return{postcssPlugin:"postcss-global-data",prepare(){let e=new Set,r=new Set;return{Once:(t,o)=>{s.files.forEach((s=>{if(e.has(s))return;const a=parseImport(t,o,s,e);a&&a.each((e=>{t.append(e),r.add(e)}))}))},OnceExit:()=>{r.forEach((e=>{e.remove()})),r=new Set,e=new Set}}}}};creator.postcss=!0;export{creator as default};
26 changes: 13 additions & 13 deletions plugins/postcss-global-data/src/parse-import.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,23 @@ import fs from 'fs';
import type { Helpers, Root } from 'postcss';
import module from 'module';

const require = module.createRequire(import.meta.url);

export function parseImport(root: Root, postcssHelpers: Helpers, filePath: string, alreadyImported: Set<string>) {
let resolvedPath = '';

if (filePath.startsWith('node_modules://')) {
try {
resolvedPath = require.resolve(filePath.slice(15), {
paths: [
path.dirname(filePath),
],
});
} catch (e) {
throw new Error(`Failed to read ${filePath} with error ${(e as Error).message}`);
try {
if (filePath.startsWith('node_modules://')) {
const require = module.createRequire(process.cwd());

resolvedPath = require.resolve(filePath.slice(15));
} else if (filePath.startsWith('node_modules:')) {
const require = module.createRequire(process.cwd());

resolvedPath = require.resolve(filePath.slice(13));
} else {
resolvedPath = path.resolve(filePath);
}
} else {
resolvedPath = path.resolve(filePath);
} catch (e) {
throw new Error(`Failed to read ${filePath} with error ${(e as Error).message}`);
}

if (alreadyImported.has(resolvedPath)) {
Expand Down