Vue/vite
1
0
Fork 0
mirror of https://github.com/vitejs/vite.git synced 2024-11-21 14:48:41 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

fix(css): escape pattern chars from base path in postcss dir-dependency messages (#7081)

Browse Source 
Co-authored-by: sapphi-red <green@sapphi.red>
This commit is contained in:
Jordan Pittman 2022-06-14 15:39:23 -04:00 committed by GitHub
parent b1baca769d
commit 5151e7466b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 27 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/vite/src/node/plugins/css.ts
View File

@ -861,7 +861,9 @@ async function compileCSS(
// https://github.com/postcss/postcss/blob/main/docs/guidelines/plugin.md#3-dependencies
const { dir, glob: globPattern = '**' } = message
const pattern =
normalizePath(path.resolve(path.dirname(id), dir)) + `/` + globPattern
glob.escapePath(normalizePath(path.resolve(path.dirname(id), dir))) +
`/` +
globPattern
const files = glob.sync(pattern, {
ignore: ['**/node_modules/**']
})

9
playground/css/__tests__/css.spec.ts
View File

@ -317,9 +317,11 @@ test('treeshaken async chunk', async () => {
test('PostCSS dir-dependency', async () => {
const el1 = await page.$('.dir-dep')
const el2 = await page.$('.dir-dep-2')
const el3 = await page.$('.dir-dep-3')
expect(await getColor(el1)).toBe('grey')
expect(await getColor(el2)).toBe('grey')
expect(await getColor(el3)).toBe('grey')
if (!isBuild) {
editFile('glob-dep/foo.css', (code) =>
@ -334,6 +336,13 @@ test('PostCSS dir-dependency', async () => {
await untilUpdated(() => getColor(el2), 'red')
expect(await getColor(el1)).toBe('blue')
editFile('glob-dep/nested (dir)/baz.css', (code) =>
code.replace('color: grey', 'color: green')
)
await untilUpdated(() => getColor(el3), 'green')
expect(await getColor(el1)).toBe('blue')
expect(await getColor(el2)).toBe('red')
// test add/remove
removeFile('glob-dep/bar.css')
await untilUpdated(() => getColor(el2), 'black')

3
playground/css/glob-dep/nested (dir)/baz.css Normal file
View File

@ -0,0 +1,3 @@
.dir-dep-3 {
color: grey;
}

3
playground/css/index.html
View File

@ -113,6 +113,9 @@
<p class="dir-dep-2">
PostCSS dir-dependency (file 2): this should be grey too
</p>
<p class="dir-dep-3">
PostCSS dir-dependency (file 3): this should be grey too
</p>
<p class="url-separated">
URL separation preservation: should have valid background-image

10
playground/css/postcss.config.js
View File

@ -16,7 +16,7 @@ function testDirDep() {
AtRule(atRule, { result, Comment }) {
if (atRule.name === 'test') {
const pattern = normalizePath(
path.resolve(path.dirname(result.opts.from), './glob-dep/*.css')
path.resolve(path.dirname(result.opts.from), './glob-dep/**/*.css')
)
const files = glob.sync(pattern)
const text = files.map((f) => fs.readFileSync(f, 'utf-8')).join('\n')
@ -30,6 +30,14 @@ function testDirDep() {
glob: '*.css',
parent: result.opts.from
})
result.messages.push({
type: 'dir-dependency',
plugin: 'dir-dep',
dir: './glob-dep/nested (dir)', // includes special characters in glob
glob: '*.css',
parent: result.opts.from
})
}
}
}