michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

[ci] format

Browse source
This commit is contained in:
matthewp 2022-06-06 18:48:00 +00:00 committed by github-actions[bot]
parent d7688f05c2
commit 88974f8b40
1 changed files with 105 additions and 100 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

205
packages/astro/src/vite-plugin-build-css/index.ts
View file

@ -72,123 +72,128 @@ export function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[]
const CSS_PLUGIN_NAME = '@astrojs/rollup-plugin-build-css'; const CSS_PLUGIN_NAME = '@astrojs/rollup-plugin-build-css';
const CSS_MINIFY_PLUGIN_NAME = '@astrojs/rollup-plugin-build-css-minify'; const CSS_MINIFY_PLUGIN_NAME = '@astrojs/rollup-plugin-build-css-minify';
return [{ return [
name: CSS_PLUGIN_NAME, {
name: CSS_PLUGIN_NAME,
configResolved(resolvedConfig) { configResolved(resolvedConfig) {
// Our plugin needs to run before `vite:css-post` because we have to modify // Our plugin needs to run before `vite:css-post` because we have to modify
// The bundles before vite:css-post sees them. We can remove this code // The bundles before vite:css-post sees them. We can remove this code
// after this bug is fixed: https://github.com/vitejs/vite/issues/8330 // after this bug is fixed: https://github.com/vitejs/vite/issues/8330
const plugins = resolvedConfig.plugins as VitePlugin[]; const plugins = resolvedConfig.plugins as VitePlugin[];
const viteCSSPostIndex = resolvedConfig.plugins.findIndex((p) => p.name === 'vite:css-post'); const viteCSSPostIndex = resolvedConfig.plugins.findIndex(
if (viteCSSPostIndex !== -1) { (p) => p.name === 'vite:css-post'
// Move our plugin to be right before this one. );
const ourIndex = plugins.findIndex((p) => p.name === CSS_PLUGIN_NAME); if (viteCSSPostIndex !== -1) {
const ourPlugin = plugins[ourIndex]; // Move our plugin to be right before this one.
const ourIndex = plugins.findIndex((p) => p.name === CSS_PLUGIN_NAME);
const ourPlugin = plugins[ourIndex];
// Remove us from where we are now and place us right before the viteCSSPost plugin // Remove us from where we are now and place us right before the viteCSSPost plugin
plugins.splice(ourIndex, 1); plugins.splice(ourIndex, 1);
plugins.splice(viteCSSPostIndex - 1, 0, ourPlugin); plugins.splice(viteCSSPostIndex - 1, 0, ourPlugin);
}
},
outputOptions(outputOptions) {
const manualChunks = outputOptions.manualChunks || Function.prototype;
outputOptions.manualChunks = function (id, ...args) {
// Defer to user-provided `manualChunks`, if it was provided.
if (typeof manualChunks == 'object') {
if (id in manualChunks) {
return manualChunks[id];
}
} else if (typeof manualChunks === 'function') {
const outid = manualChunks.call(this, id, ...args);
if (outid) {
return outid;
}
} }
},
// For CSS, create a hash of all of the pages that use it. outputOptions(outputOptions) {
// This causes CSS to be built into shared chunks when used by multiple pages. const manualChunks = outputOptions.manualChunks || Function.prototype;
if (isCSSRequest(id)) { outputOptions.manualChunks = function (id, ...args) {
return createHashOfPageParents(id, args[0]); // Defer to user-provided `manualChunks`, if it was provided.
} if (typeof manualChunks == 'object') {
}; if (id in manualChunks) {
}, return manualChunks[id];
}
} else if (typeof manualChunks === 'function') {
const outid = manualChunks.call(this, id, ...args);
if (outid) {
return outid;
}
}
async generateBundle(_outputOptions, bundle) { // For CSS, create a hash of all of the pages that use it.
type ViteMetadata = { // This causes CSS to be built into shared chunks when used by multiple pages.
importedAssets: Set<string>; if (isCSSRequest(id)) {
importedCss: Set<string>; return createHashOfPageParents(id, args[0]);
}; }
};
},
for (const [_, chunk] of Object.entries(bundle)) { async generateBundle(_outputOptions, bundle) {
if (chunk.type === 'chunk') { type ViteMetadata = {
const c = chunk; importedAssets: Set<string>;
if ('viteMetadata' in chunk) { importedCss: Set<string>;
const meta = chunk['viteMetadata'] as ViteMetadata; };
// Chunks that have the viteMetadata.importedCss are CSS chunks for (const [_, chunk] of Object.entries(bundle)) {
if (meta.importedCss.size) { if (chunk.type === 'chunk') {
// For the client build, client:only styles need to be mapped const c = chunk;
// over to their page. For this chunk, determine if it's a child of a if ('viteMetadata' in chunk) {
// client:only component and if so, add its CSS to the page it belongs to. const meta = chunk['viteMetadata'] as ViteMetadata;
if (options.target === 'client') {
// Chunks that have the viteMetadata.importedCss are CSS chunks
if (meta.importedCss.size) {
// For the client build, client:only styles need to be mapped
// over to their page. For this chunk, determine if it's a child of a
// client:only component and if so, add its CSS to the page it belongs to.
if (options.target === 'client') {
for (const [id] of Object.entries(c.modules)) {
for (const pageData of getParentClientOnlys(id, this)) {
for (const importedCssImport of meta.importedCss) {
pageData.css.add(importedCssImport);
}
}
}
}
// For this CSS chunk, walk parents until you find a page. Add the CSS to that page.
for (const [id] of Object.entries(c.modules)) { for (const [id] of Object.entries(c.modules)) {
for (const pageData of getParentClientOnlys(id, this)) { for (const pageViteID of getTopLevelPages(id, this)) {
const pageData = getPageDataByViteID(internals, pageViteID);
for (const importedCssImport of meta.importedCss) { for (const importedCssImport of meta.importedCss) {
pageData.css.add(importedCssImport); pageData?.css.add(importedCssImport);
} }
} }
} }
} }
}
}
// For this CSS chunk, walk parents until you find a page. Add the CSS to that page. if (chunk.type === 'chunk') {
for (const [id] of Object.entries(c.modules)) { // This simply replaces single quotes with double quotes because the vite:css-post
for (const pageViteID of getTopLevelPages(id, this)) { // plugin only works with single for some reason. This code can be removed
const pageData = getPageDataByViteID(internals, pageViteID); // When the Vite bug is fixed: https://github.com/vitejs/vite/issues/8330
for (const importedCssImport of meta.importedCss) { const exp = new RegExp(
pageData?.css.add(importedCssImport); `(\\bimport\\s*)[']([^']*(?:[a-z]+\.[0-9a-z]+\.m?js))['](;\n?)`,
} 'g'
} );
chunk.code = chunk.code.replace(exp, (_match, begin, chunkPath, end) => {
return begin + '"' + chunkPath + '"' + end;
});
}
}
},
},
{
name: CSS_MINIFY_PLUGIN_NAME,
enforce: 'post',
async generateBundle(_outputOptions, bundle) {
// Minify CSS in each bundle ourselves, since server builds are not minified
// so that the JS is debuggable. Since you cannot configure vite:css-post to minify
// we need to do it ourselves.
if (options.target === 'server') {
for (const [, output] of Object.entries(bundle)) {
if (output.type === 'asset') {
if (output.name?.endsWith('.css') && typeof output.source === 'string') {
const { code: minifiedCSS } = await esbuild.transform(output.source, {
loader: 'css',
minify: true,
});
output.source = minifiedCSS;
} }
} }
} }
} }
},
if (chunk.type === 'chunk') {
// This simply replaces single quotes with double quotes because the vite:css-post
// plugin only works with single for some reason. This code can be removed
// When the Vite bug is fixed: https://github.com/vitejs/vite/issues/8330
const exp = new RegExp(
`(\\bimport\\s*)[']([^']*(?:[a-z]+\.[0-9a-z]+\.m?js))['](;\n?)`,
'g'
);
chunk.code = chunk.code.replace(exp, (_match, begin, chunkPath, end) => {
return begin + '"' + chunkPath + '"' + end;
});
}
}
}, },
}, { ];
name: CSS_MINIFY_PLUGIN_NAME,
enforce: 'post',
async generateBundle(_outputOptions, bundle) {
// Minify CSS in each bundle ourselves, since server builds are not minified
// so that the JS is debuggable. Since you cannot configure vite:css-post to minify
// we need to do it ourselves.
if(options.target === 'server') {
for(const [, output] of Object.entries(bundle)) {
if(output.type === 'asset') {
if(output.name?.endsWith('.css') && typeof output.source === 'string') {
const { code: minifiedCSS } = await esbuild.transform(output.source, {
loader: 'css',
minify: true,
});
output.source = minifiedCSS;
}
}
}
}
}
}];
} }