diff --git a/packages/cli/package.json b/packages/cli/package.json
index ce6bd2557..524f7ee33 100644
--- a/packages/cli/package.json
+++ b/packages/cli/package.json
@@ -24,12 +24,12 @@
"access": "public"
},
"dependencies": {
+ "@parcel/css": "^1.13.1",
"@rollup/plugin-node-resolve": "^13.0.0",
"@rollup/plugin-replace": "^2.3.4",
"acorn": "^8.0.1",
"acorn-walk": "^8.0.0",
"commander": "^2.20.0",
- "cssnano": "^5.0.11",
"es-module-shims": "^1.2.0",
"front-matter": "^4.0.2",
"koa": "^2.13.0",
@@ -37,8 +37,6 @@
"markdown-toc": "^1.2.0",
"node-fetch": "^2.6.1",
"node-html-parser": "^1.2.21",
- "postcss": "^8.3.11",
- "postcss-import": "^13.0.0",
"rehype-raw": "^5.0.0",
"rehype-stringify": "^8.0.0",
"remark-frontmatter": "^2.0.0",
diff --git a/packages/cli/src/lifecycles/bundle.js b/packages/cli/src/lifecycles/bundle.js
index da8a2cf37..fcefe6bd4 100644
--- a/packages/cli/src/lifecycles/bundle.js
+++ b/packages/cli/src/lifecycles/bundle.js
@@ -74,6 +74,7 @@ async function bundleStyleResources(compilation, optimizationPlugins) {
}
const outputPathRoot = path.join(outputDir, path.dirname(optimizedFileName));
+ const outputPath = path.join(outputDir, optimizedFileName);
if (!fs.existsSync(outputPathRoot)) {
fs.mkdirSync(outputPathRoot, {
@@ -88,21 +89,31 @@ async function bundleStyleResources(compilation, optimizationPlugins) {
let optimizedStyles = await fs.promises.readFile(url, 'utf-8');
for (const plugin of optimizationPlugins) {
- optimizedStyles = await plugin.shouldOptimize(url, optimizedStyles)
- ? await plugin.optimize(url, optimizedStyles)
+ optimizedStyles = await plugin.shouldIntercept(url, optimizedStyles)
+ ? (await plugin.intercept(url, optimizedStyles)).body
: optimizedStyles;
}
optimizedFileContents = optimizedStyles;
}
+ // have to do this to support ParcelCSS since bundling can only work with the filesystem
+ await fs.promises.writeFile(outputPath, optimizedFileContents);
+
+ for (const plugin of optimizationPlugins) {
+ if (await plugin.shouldOptimize(outputPath, optimizedFileContents)) {
+ optimizedFileContents = await plugin.optimize(outputPath, optimizedFileContents);
+ await fs.promises.writeFile(outputPath, optimizedFileContents);
+ }
+ }
+
compilation.resources.set(resourceKey, {
...compilation.resources.get(resourceKey),
optimizedFileName,
optimizedFileContents
});
- await fs.promises.writeFile(path.join(outputDir, optimizedFileName), optimizedFileContents);
+ await fs.promises.writeFile(outputPath, optimizedFileContents);
}
}
}
@@ -126,7 +137,8 @@ const bundleCompilation = async (compilation) => {
}).map((plugin) => {
return plugin.provider(compilation);
}).filter((provider) => {
- return provider.shouldOptimize && provider.optimize;
+ return provider.shouldOptimize && provider.optimize ||
+ provider.shouldIntercept && provider.intercept;
});
// centrally register all static resources
compilation.graph.map((page) => {
diff --git a/packages/cli/src/plugins/resource/plugin-standard-css.js b/packages/cli/src/plugins/resource/plugin-standard-css.js
index a6f53c9f9..4fb55cd8a 100644
--- a/packages/cli/src/plugins/resource/plugin-standard-css.js
+++ b/packages/cli/src/plugins/resource/plugin-standard-css.js
@@ -6,9 +6,7 @@
*/
import fs from 'fs';
import path from 'path';
-import cssnano from 'cssnano';
-import postcss from 'postcss';
-import postcssImport from 'postcss-import';
+import * as css from '@parcel/css';
import { ResourceInterface } from '../../lib/resource-interface.js';
class StandardCssResource extends ResourceInterface {
@@ -39,17 +37,36 @@ class StandardCssResource extends ResourceInterface {
return Promise.resolve(isValidCss);
}
- async optimize(url, body) {
+ async optimize(url) {
+ console.debug({ url });
+ const { outputDir, userWorkspace } = this.compilation.context;
+
return new Promise(async (resolve, reject) => {
try {
- const { outputDir, userWorkspace } = this.compilation.context;
- const workspaceUrl = url.replace(outputDir, userWorkspace);
- const contents = body || await fs.promises.readFile(url, 'utf-8');
- const css = (await postcss([cssnano])
- .use(postcssImport())
- .process(contents, { from: workspaceUrl })).css;
+ // const { code } = css.transform({
+ // code: new TextEncoder().encode(body),
+ // minify: true
+ // });
+ const { code } = await css.bundleAsync({
+ filename: url,
+ minify: true,
+ resolver: {
+ resolve(specifier, from) {
+ console.debug('resolve', path.dirname(url.replace(outputDir, userWorkspace)));
+ console.debug({ from });
+ console.debug({ specifier });
+ if (specifier.indexOf('http') !== 0 && specifier.indexOf('//') !== 0) {
+ return path.resolve(path.dirname(url.replace(outputDir, userWorkspace)), specifier);
+ } else {
+ return specifier;
+ }
+ }
+ }
+ });
+
+ console.debug({ code });
- resolve(css);
+ resolve(code);
} catch (e) {
reject(e);
}
diff --git a/packages/cli/test/cases/build.config.optimization-inline/build.config-optimization-inline.spec.js b/packages/cli/test/cases/build.config.optimization-inline/build.config-optimization-inline.spec.js
index a882c1418..375df1661 100644
--- a/packages/cli/test/cases/build.config.optimization-inline/build.config-optimization-inline.spec.js
+++ b/packages/cli/test/cases/build.config.optimization-inline/build.config-optimization-inline.spec.js
@@ -138,7 +138,7 @@ describe('Build Greenwood With: ', function() {
it('should contain the expected CSS content inlined for theme.css', function() {
const styleTags = dom.window.document.querySelectorAll('head style');
- expect(styleTags[0].textContent).to.contain('*{font-family:Comic Sans,sans-serif;margin:0;padding:0}');
+ expect(styleTags[0].textContent).to.contain('*{margin:0;padding:0;font-family:Comic Sans,sans-serif}');
});
it('should contain the expected CSS content inlined for page.css', function() {
diff --git a/packages/cli/test/cases/build.config.optimization-overrides/build.config-optimization-overrides.spec.js b/packages/cli/test/cases/build.config.optimization-overrides/build.config-optimization-overrides.spec.js
index 22067cd67..30cecbb97 100644
--- a/packages/cli/test/cases/build.config.optimization-overrides/build.config-optimization-overrides.spec.js
+++ b/packages/cli/test/cases/build.config.optimization-overrides/build.config-optimization-overrides.spec.js
@@ -153,7 +153,7 @@ describe('Build Greenwood With: ', function() {
it('should have an inline