From 54b2e7df1654171d2f6b5f8a75c2a1be2d1f12f8 Mon Sep 17 00:00:00 2001 From: Matthew Phillips Date: Thu, 17 Feb 2022 10:16:58 -0500 Subject: [PATCH 1/2] Fix loading of styles in static build --- packages/astro/src/core/path.ts | 4 ++++ packages/astro/src/vite-plugin-astro/index.ts | 15 ++++++++++----- packages/astro/test/static-build.test.js | 9 +++++++++ 3 files changed, 23 insertions(+), 5 deletions(-) diff --git a/packages/astro/src/core/path.ts b/packages/astro/src/core/path.ts index 9f66baf28617..16945d960ac8 100644 --- a/packages/astro/src/core/path.ts +++ b/packages/astro/src/core/path.ts @@ -10,6 +10,10 @@ export function removeEndingForwardSlash(path: string) { return path.endsWith('/') ? path.slice(0, path.length - 1) : path; } +export function startsWithForwardSlash(path: string) { + return path[0] === '/'; +} + export function startsWithDotDotSlash(path: string) { const c1 = path[0]; const c2 = path[1]; diff --git a/packages/astro/src/vite-plugin-astro/index.ts b/packages/astro/src/vite-plugin-astro/index.ts index e9600673550a..c6818c5eeb5b 100644 --- a/packages/astro/src/vite-plugin-astro/index.ts +++ b/packages/astro/src/vite-plugin-astro/index.ts @@ -11,7 +11,7 @@ import { parseAstroRequest } from './query.js'; import { cachedCompilation } from './compile.js'; import ancestor from 'common-ancestor-path'; import { trackCSSDependencies, handleHotUpdate } from './hmr.js'; -import { isRelativePath } from '../core/path.js'; +import { isRelativePath, startsWithForwardSlash } from '../core/path.js'; const FRONTMATTER_PARSE_REGEXP = /^\-\-\-(.*)^\-\-\-/ms; interface AstroPluginOptions { @@ -29,6 +29,11 @@ export default function astro({ config, logging }: AstroPluginOptions): vite.Plu } return filename; } + function relativeToRoot(pathname: string) { + const arg = startsWithForwardSlash(pathname) ? '.' + pathname : pathname; + const url = new URL(arg, config.projectRoot); + return slash(fileURLToPath(url)) + url.search; + } let viteTransform: TransformHook; let viteDevServer: vite.ViteDevServer | null = null; @@ -52,13 +57,13 @@ export default function astro({ config, logging }: AstroPluginOptions): vite.Plu // we need to resolve relative paths ourselves. if (from) { const { query: fromQuery, filename } = parseAstroRequest(from); - if (fromQuery.astro && isRelativePath(id)) { + if (fromQuery.astro && isRelativePath(id) && fromQuery.type === 'script') { const resolvedURL = new URL(id, `file://${filename}`); const resolved = resolvedURL.pathname; if (isBrowserPath(resolved)) { - return slash(fileURLToPath(new URL('.' + resolved, config.projectRoot))); + return relativeToRoot(resolved + resolvedURL.search); } - return slash(fileURLToPath(resolvedURL)); + return slash(fileURLToPath(resolvedURL)) + resolvedURL.search; } } @@ -69,7 +74,7 @@ export default function astro({ config, logging }: AstroPluginOptions): vite.Plu // Because this needs to be the id for the Vite CSS plugin to property resolve // relative @imports. if (query.type === 'style' && isBrowserPath(id)) { - return slash(fileURLToPath(new URL('.' + id, config.projectRoot))); + return relativeToRoot(id); } return id; diff --git a/packages/astro/test/static-build.test.js b/packages/astro/test/static-build.test.js index 45a125f9b242..bb903e968375 100644 --- a/packages/astro/test/static-build.test.js +++ b/packages/astro/test/static-build.test.js @@ -91,6 +91,15 @@ describe('Static build', () => { }; } + describe('Page CSS', () => { + const findEvidence = createFindEvidence(/height:( )*45vw/); + + it('Page level CSS is added', async () => { + const found = await findEvidence('/subpath/index.html'); + expect(found).to.equal(true, 'Did not find page-level CSS on this page'); + }); + }); + describe('Shared CSS', () => { const findEvidence = createFindEvidence(/var\(--c\)/); From 9c2c464bae4a2768a2dab68c7b67ff2add675ec1 Mon Sep 17 00:00:00 2001 From: Matthew Phillips Date: Thu, 17 Feb 2022 10:19:50 -0500 Subject: [PATCH 2/2] Adds a changeset --- .changeset/fuzzy-drinks-drop.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/fuzzy-drinks-drop.md diff --git a/.changeset/fuzzy-drinks-drop.md b/.changeset/fuzzy-drinks-drop.md new file mode 100644 index 000000000000..5c59ae2673ed --- /dev/null +++ b/.changeset/fuzzy-drinks-drop.md @@ -0,0 +1,5 @@ +--- +'astro': patch +--- + +Fixes Astro style resolution in the static build