Skip to content

Commit ce736f6

Browse files
committed
Enforce double-underscored aliases according icss spec
1 parent 32e2c48 commit ce736f6

File tree

2 files changed

+35
-33
lines changed

2 files changed

+35
-33
lines changed

src/index.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,11 @@ const matchImports = /^(.+?|\([\s\S]+?\))\s+from\s+("[^"]*"|'[^']*'|[\w-]+)$/
66
const matchValueDefinition = /(?:\s+|^)([\w-]+):?\s+(.+?)\s*$/g
77
const matchImport = /^([\w-]+)(?:\s+as\s+([\w-]+))?/
88

9+
const getAliasName = (name, index) =>
10+
`__value_${name.replace(/\W/g, '_')}_${index}`
11+
912
let importIndex = 0
10-
const createImportedName = importName =>
11-
`i__const_${importName.replace(/\W/g, '_')}_${importIndex++}`
13+
const createImportedName = importName => getAliasName(importName, importIndex++)
1214

1315
module.exports = postcss.plugin('postcss-modules-values', () => (
1416
css,

test/test.js

Lines changed: 31 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -76,10 +76,10 @@ test('should import and re-export a simple constant', () => {
7676
).resolves.toEqual(
7777
strip(`
7878
:import("./colors.css") {
79-
i__const_red_0: red
79+
__value_red_0: red
8080
}
8181
:export {
82-
red: i__const_red_0
82+
red: __value_red_0
8383
}
8484
`)
8585
)
@@ -94,12 +94,12 @@ test('should import a simple constant and replace usages', () => {
9494
).resolves.toEqual(
9595
strip(`
9696
:import("./colors.css") {
97-
i__const_red_1: red;
97+
__value_red_1: red;
9898
}
9999
:export {
100-
red: i__const_red_1;
100+
red: __value_red_1;
101101
}
102-
.foo { color: i__const_red_1; }
102+
.foo { color: __value_red_1; }
103103
`)
104104
)
105105
})
@@ -113,12 +113,12 @@ test('should import and alias a constant and replace usages', () => {
113113
).resolves.toEqual(
114114
strip(`
115115
:import("./colors.css") {
116-
i__const_red_2: blue;
116+
__value_red_2: blue;
117117
}
118118
:export {
119-
red: i__const_red_2;
119+
red: __value_red_2;
120120
}
121-
.foo { color: i__const_red_2; }
121+
.foo { color: __value_red_2; }
122122
`)
123123
)
124124
})
@@ -133,15 +133,15 @@ test('should import multiple from a single file', () => {
133133
).resolves.toEqual(
134134
strip(`
135135
:import("./colors.css") {
136-
i__const_blue_3: blue;
137-
i__const_red_4: red;
136+
__value_blue_3: blue;
137+
__value_red_4: red;
138138
}
139139
:export {
140-
blue: i__const_blue_3;
141-
red: i__const_red_4;
140+
blue: __value_blue_3;
141+
red: __value_red_4;
142142
}
143-
.foo { color: i__const_red_4; }
144-
.bar { color: i__const_blue_3 }
143+
.foo { color: __value_red_4; }
144+
.bar { color: __value_blue_3 }
145145
`)
146146
)
147147
})
@@ -154,11 +154,11 @@ test('should import from a definition', () => {
154154
).resolves.toEqual(
155155
strip(`
156156
:import("./colors.css") {
157-
i__const_red_5: red
157+
__value_red_5: red
158158
}
159159
:export {
160160
colors: "./colors.css";
161-
red: i__const_red_5
161+
red: __value_red_5
162162
}
163163
`)
164164
)
@@ -172,10 +172,10 @@ test('should only allow values for paths if defined in the right order', () => {
172172
).resolves.toEqual(
173173
strip(`
174174
:import(colors) {
175-
i__const_red_6: red
175+
__value_red_6: red
176176
}
177177
:export {
178-
red: i__const_red_6;
178+
red: __value_red_6;
179179
colors: "./colors.css"
180180
}
181181
`)
@@ -226,14 +226,14 @@ test('should preserve import order', () => {
226226
).resolves.toEqual(
227227
strip(`
228228
:import("./a.css") {
229-
i__const_a_7: a
229+
__value_a_7: a
230230
}
231231
:import("./b.css") {
232-
i__const_b_8: b
232+
__value_b_8: b
233233
}
234234
:export {
235-
a: i__const_a_7;
236-
b: i__const_b_8
235+
a: __value_a_7;
236+
b: __value_b_8
237237
}
238238
`)
239239
)
@@ -247,12 +247,12 @@ test('should allow custom-property-style names', () => {
247247
).resolves.toEqual(
248248
strip(`
249249
:import("./colors.css") {
250-
i__const___red_9: --red;
250+
__value___red_9: --red;
251251
}
252252
:export {
253-
--red: i__const___red_9;
253+
--red: __value___red_9;
254254
}
255-
.foo { color: i__const___red_9; }
255+
.foo { color: __value___red_9; }
256256
`)
257257
)
258258
})
@@ -306,15 +306,15 @@ test('should import multiple from a single file on multiple lines', () => {
306306
).resolves.toEqual(
307307
strip(`
308308
:import("./colors.css") {
309-
i__const_blue_10: blue;
310-
i__const_red_11: red;
309+
__value_blue_10: blue;
310+
__value_red_11: red;
311311
}
312312
:export {
313-
blue: i__const_blue_10;
314-
red: i__const_red_11;
313+
blue: __value_blue_10;
314+
red: __value_red_11;
315315
}
316-
.foo { color: i__const_red_11; }
317-
.bar { color: i__const_blue_10 }
316+
.foo { color: __value_red_11; }
317+
.bar { color: __value_blue_10 }
318318
`)
319319
)
320320
})

0 commit comments

Comments
 (0)