@compiled/parcel-transformer 0.9.1 → 0.11.0

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import { Transformer } from '@parcel/plugin';
 import type { ParcelTransformerOpts } from './types';
-declare const _default: Transformer<ParcelTransformerOpts>;
 /**
  * Compiled parcel transformer.
  */
+declare const _default: Transformer<ParcelTransformerOpts>;
 export default _default;

package/dist/index.js

@@ -3,12 +3,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const fs_1 = __importDefault(require("fs"));
 const path_1 = require("path");
 const core_1 = require("@babel/core");
 const generator_1 = __importDefault(require("@babel/generator"));
 const utils_1 = require("@compiled/utils");
 const plugin_1 = require("@parcel/plugin");
 const source_map_1 = __importDefault(require("@parcel/source-map"));
+const enhanced_resolve_1 = require("enhanced-resolve");
 const configFiles = [
     '.compiledcssrc',
     '.compiledcssrc.json',
@@ -38,9 +40,11 @@ exports.default = new plugin_1.Transformer({
         // Compiled should run before any other JS transformer.
         return false;
     },
-    async parse({ asset, config }) {
+    async parse({ asset, config, options }) {
         var _a, _b;
-        if (!asset.isSource && !config.extract) {
+        // Disable stylesheet extraction locally due to https://github.com/atlassian-labs/compiled/issues/1306
+        const extract = config.extract && options.mode !== 'development';
+        if (!asset.isSource && !extract) {
             // Only parse source (pre-built code should already have been baked) or if stylesheet extraction is enabled
             return undefined;
         }
@@ -65,16 +69,23 @@ exports.default = new plugin_1.Transformer({
             program,
         };
     },
-    async transform({ asset, config }) {
-        var _a, _b;
+    async transform({ asset, config, options }) {
+        var _a, _b, _c;
         const ast = await asset.getAST();
         if (!ast) {
             // We will only receive ASTs for assets we're interested in.
             // Since this is undefined (or in node modules) we aren't interested in it.
             return [asset];
         }
+        // Disable stylesheet extraction locally due to https://github.com/atlassian-labs/compiled/issues/1306
+        const extract = config.extract && options.mode !== 'development';
         const includedFiles = [];
         const code = asset.isASTDirty() ? undefined : await asset.getCode();
+        const resolver = enhanced_resolve_1.ResolverFactory.createResolver(Object.assign(Object.assign(Object.assign({ fileSystem: new enhanced_resolve_1.CachedInputFileSystem(fs_1.default, 4000) }, (config.extensions && {
+            extensions: config.extensions,
+        })), ((_a = config.resolve) !== null && _a !== void 0 ? _a : {})), { 
+            // This makes the resolver invoke the callback synchronously
+            useSyncFileSystemCalls: true }));
         const result = await (0, core_1.transformFromAstAsync)(ast.program, code, {
             code: true,
             ast: false,
@@ -83,19 +94,23 @@ exports.default = new plugin_1.Transformer({
             configFile: false,
             sourceMaps: true,
             parserOpts: {
-                plugins: (_a = config.parserBabelPlugins) !== null && _a !== void 0 ? _a : undefined,
+                plugins: (_b = config.parserBabelPlugins) !== null && _b !== void 0 ? _b : undefined,
             },
             plugins: [
-                ...((_b = config.transformerBabelPlugins) !== null && _b !== void 0 ? _b : []),
+                ...((_c = config.transformerBabelPlugins) !== null && _c !== void 0 ? _c : []),
                 asset.isSource && [
                     '@compiled/babel-plugin',
-                    Object.assign(Object.assign({}, config), { onIncludedFiles: (files) => includedFiles.push(...files), cache: false }),
+                    Object.assign(Object.assign({}, config), { onIncludedFiles: (files) => includedFiles.push(...files), resolver: {
+                            // The resolver needs to be synchronous, as babel plugins must be synchronous
+                            resolveSync: (context, request) => {
+                                return resolver.resolveSync({}, (0, path_1.dirname)(context), request);
+                            },
+                        }, cache: false }),
                 ],
-                config.extract && [
+                extract && [
                     '@compiled/babel-plugin-strip-runtime',
                     {
-                        styleSheetPath: 'compiled-css!',
-                        compiledRequireExclude: config.ssr,
+                        compiledRequireExclude: true,
                     },
                 ],
             ].filter(utils_1.toBoolean),
@@ -111,6 +126,11 @@ exports.default = new plugin_1.Transformer({
             asset.invalidateOnFileChange(file);
         });
         asset.setCode(output);
+        if (extract) {
+            // Store styleRules to asset.meta to be used by @compiled/parcel-optimizer
+            const metadata = result === null || result === void 0 ? void 0 : result.metadata;
+            asset.meta.styleRules = metadata.styleRules;
+        }
         return [asset];
     },
     async generate({ asset, ast }) {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/types.d.ts

@@ -1,6 +1,7 @@
 import type { PluginItem } from '@babel/core';
 import type { PluginOptions } from '@compiled/babel-plugin';
-declare type BabelPluginOpts = Omit<PluginOptions, 'cache' | 'onIncludedFiles'>;
+import type { ResolveOptions } from 'enhanced-resolve';
+declare type BabelPluginOpts = Omit<PluginOptions, 'cache' | 'onIncludedFiles' | 'resolver'>;
 export interface ParcelTransformerOpts extends BabelPluginOpts {
     extract?: boolean;
     stylesheetPath?: string;
@@ -15,5 +16,15 @@ export interface ParcelTransformerOpts extends BabelPluginOpts {
      * Defaults to `false`.
      */
     ssr?: boolean;
+    /**
+     * Will run additional cssnano plugins to normalize CSS during build.
+     *
+     * Default to `true`.
+     */
+    optimizeCss?: boolean;
+    /**
+     * Override the default `resolve` used by @compiled/babel-plugin, which is used to statically evaluate import declarations
+     */
+    resolve?: ResolveOptions;
 }
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@compiled/parcel-transformer",
-  "version": "0.9.1",
+  "version": "0.11.0",
   "description": "A familiar and performant compile time CSS-in-JS library for React.",
   "homepage": "https://compiledcssinjs.com/docs/pkg-parcel-transformer",
   "bugs": "https://github.com/atlassian-labs/compiled/issues/new?assignees=&labels=bug&template=bug_report.md",
@@ -22,17 +22,19 @@
   "dependencies": {
     "@babel/core": "^7.17.10",
     "@babel/generator": "^7.17.10",
-    "@compiled/babel-plugin": "^0.16.0",
-    "@compiled/babel-plugin-strip-runtime": "^0.16.0",
+    "@compiled/babel-plugin": "^0.16.5",
+    "@compiled/babel-plugin-strip-runtime": "^0.17.0",
     "@compiled/utils": "^0.6.16",
     "@parcel/plugin": "^2.3.2",
-    "@parcel/source-map": "^2.0.2"
+    "@parcel/source-map": "^2.0.2",
+    "enhanced-resolve": "^5.10.0"
   },
   "devDependencies": {
     "@parcel/core": "^2.3.1",
     "@parcel/fs": "^2.3.1",
     "@parcel/types": "^2.3.1",
-    "@types/babel__core": "^7.1.19"
+    "@types/babel__core": "^7.1.19",
+    "prettier": "^2.7.1"
   },
   "engines": {
     "parcel": "^2.0.0"

package/src/__tests__/transformer.parceltest.ts

@@ -2,10 +2,15 @@ import { join } from 'path';
 
 import Parcel, { createWorkerFarm } from '@parcel/core';
 import { MemoryFS } from '@parcel/fs';
+import { format } from 'prettier';
 
 const rootPath = join(__dirname, '..', '..', '..', '..');
 const fixtureRoot = join(rootPath, 'fixtures/parcel-transformer-test-app');
 const extractionFixtureRoot = join(rootPath, 'fixtures/parcel-transformer-test-extract-app');
+const customResolverFixtureRoot = join(
+  rootPath,
+  'fixtures/parcel-transformer-test-custom-resolver-app'
+);
 const babelComponentFixture = join(rootPath, 'fixtures/babel-component');
 
 const workerFarm = createWorkerFarm();
@@ -14,8 +19,9 @@ afterAll(() => {
   workerFarm.end();
 });
 
+const outputFS = new MemoryFS(workerFarm);
+
 const getParcelInstance = (workingDir: string) => {
-  const outputFS = new MemoryFS(workerFarm);
   return new Parcel({
     config: join(workingDir, '.parcelrc'),
     entries: [join(workingDir, 'src', 'index.html')],
@@ -26,6 +32,7 @@ const getParcelInstance = (workingDir: string) => {
       },
     },
     workerFarm,
+    mode: 'production',
   });
 };
 
@@ -68,9 +75,22 @@ it('transforms assets with babel plugin', async () => {
   `);
 }, 50000);
 
+it('transforms assets with custom resolver and statically evaluates imports', async () => {
+  const parcel = getParcelInstance(customResolverFixtureRoot);
+  const { changedAssets } = await parcel.run();
+
+  const asset = Array.from(changedAssets.values()).find(
+    (asset) => asset.filePath === join(customResolverFixtureRoot, 'src/index.jsx')
+  );
+
+  const code = await asset?.getCode();
+
+  expect(code).toInclude('color:red');
+}, 50000);
+
 it('transforms assets with compiled and extraction babel plugins', async () => {
   const parcel = getParcelInstance(extractionFixtureRoot);
-  const { changedAssets } = await parcel.run();
+  const { changedAssets, bundleGraph } = await parcel.run();
   const assets = Array.from(changedAssets.values());
 
   const indexJsCode = await assets
@@ -78,75 +98,98 @@ it('transforms assets with compiled and extraction babel plugins', async () => {
     ?.getCode();
   expect(indexJsCode).toMatchInlineSnapshot(`
     "var parcelHelpers = require(\\"@parcel/transformer-js/src/esmodule-helpers.js\\");
-    var _jsxDevRuntime = require(\\"react/jsx-dev-runtime\\");
-    var _runtime = require(\\"@compiled/react/runtime\\");
+    var _jsxRuntime = require(\\"react/jsx-runtime\\");
+    /* index.jsx generated by @compiled/babel-plugin v0.0.0 */ var _runtime = require(\\"@compiled/react/runtime\\");
     var _babelComponentFixture = require(\\"@compiled/babel-component-fixture\\");
     var _babelComponentFixtureDefault = parcelHelpers.interopDefault(_babelComponentFixture);
-    var _this = undefined;
-    /* index.jsx generated by @compiled/babel-plugin v0.0.0 */ require(\\"compiled-css!?style=._syaz5scu%7Bcolor%3Ared%7D\\");
-    require(\\"compiled-css!?style=._1wyb12am%7Bfont-size%3A50px%7D\\");
     var App = function() {
-        /*#__PURE__*/ return _jsxDevRuntime.jsxDEV(_jsxDevRuntime.Fragment, {
+        /*#__PURE__*/ return _jsxRuntime.jsxs(_jsxRuntime.Fragment, {
             children: [
-                /*#__PURE__*/ _jsxDevRuntime.jsxDEV(\\"div\\", {
+                /*#__PURE__*/ _jsxRuntime.jsx(\\"div\\", {
                     className: _runtime.ax([
                         \\"_1wyb12am _syaz5scu\\"
                     ]),
                     children: \\"CSS prop\\"
-                }, void 0, false, {
-                    fileName: \\"src/index.jsx\\",
-                    lineNumber: 11,
-                    columnNumber: 5
-                }, _this),
-                /*#__PURE__*/ _jsxDevRuntime.jsxDEV(_babelComponentFixtureDefault.default, {
+                }),
+                /*#__PURE__*/ _jsxRuntime.jsx(_babelComponentFixtureDefault.default, {
                     children: \\"Babel component\\"
-                }, void 0, false, {
-                    fileName: \\"src/index.jsx\\",
-                    lineNumber: 12,
-                    columnNumber: 5
-                }, _this)
+                })
             ]
-        }, void 0, true);
+        });
     };
     "
   `);
 
+  const htmlAsset = Array.from(changedAssets.values()).find(
+    (asset) => asset.filePath === join(extractionFixtureRoot, '/src/index.html')
+  );
+
+  const outputHtml = await outputFS.readFile(
+    bundleGraph.getBundlesWithAsset(htmlAsset!)[0].filePath,
+    'utf8'
+  );
+
+  const css = /<style>(.*?)<\/style>/.exec(outputHtml)?.pop();
+
+  if (!css) throw new Error('No CSS is found.');
+
+  expect(
+    format(css, {
+      parser: 'css',
+      singleQuote: true,
+    })
+  ).toMatchInlineSnapshot(`
+    "._1wyb12am {
+      font-size: 50px;
+    }
+    ._syaz5scu {
+      color: red;
+    }
+    ._syaz13q2 {
+      color: blue;
+    }
+    ._1wyb1ul9 {
+      font-size: 30px;
+    }
+    ._19itlf8h {
+      border: 2px solid blue;
+    }
+    ._ca0q1vi7 {
+      padding-top: 32px;
+    }
+    ._u5f31vi7 {
+      padding-right: 32px;
+    }
+    ._n3td1vi7 {
+      padding-bottom: 32px;
+    }
+    ._19bv1vi7 {
+      padding-left: 32px;
+    }
+    ._19pk1ul9 {
+      margin-top: 30px;
+    }
+    "
+  `);
+
   const babelComponentCode = await assets
     .find((asset) => asset.filePath === join(babelComponentFixture, 'dist/index.js'))
     ?.getCode();
 
-  const extractedCss = babelComponentCode
-    ?.slice(0, babelComponentCode.indexOf('exports.default = BabelComponent;'))
-    .trim();
-  expect(extractedCss).toMatchInlineSnapshot(`
-    "/* index.jsx generated by @compiled/babel-plugin v0.0.0 */ \\"use strict\\";
-    require(\\"compiled-css!?style=._19pk1ul9%7Bmargin-top%3A30px%7D\\");
-    require(\\"compiled-css!?style=._19bvftgi%7Bpadding-left%3A8px%7D\\");
-    require(\\"compiled-css!?style=._n3tdftgi%7Bpadding-bottom%3A8px%7D\\");
-    require(\\"compiled-css!?style=._u5f3ftgi%7Bpadding-right%3A8px%7D\\");
-    require(\\"compiled-css!?style=._ca0qftgi%7Bpadding-top%3A8px%7D\\");
-    require(\\"compiled-css!?style=._19itlf8h%7Bborder%3A2px%20solid%20blue%7D\\");
-    require(\\"compiled-css!?style=._1wyb1ul9%7Bfont-size%3A30px%7D\\");
-    require(\\"compiled-css!?style=._syaz13q2%7Bcolor%3Ablue%7D\\");
-    Object.defineProperty(exports, \\"__esModule\\", {
-        value: true
-    });"
-  `);
-
   const extractedComponent = babelComponentCode
     ?.slice(babelComponentCode.indexOf('var Button'))
     .trim();
   expect(extractedComponent).toMatchInlineSnapshot(`
-    "var Button = (0, _react.forwardRef)(function(_ref, ref) {
-        var _ref$as = _ref.as, C = _ref$as === void 0 ? \\"button\\" : _ref$as, style = _ref.style, props = _objectWithoutProperties(_ref, _excluded);
+    "var Button = (0, _react.forwardRef)(function(_ref, __cmplr) {
+        var _ref$as = _ref.as, C = _ref$as === void 0 ? \\"button\\" : _ref$as, __cmpls = _ref.style, __cmplp = _objectWithoutProperties(_ref, _excluded);
         return (0, _jsxRuntime.jsx)(C, _objectSpread(_objectSpread({
-        }, props), {
+        }, __cmplp), {
         }, {
-            style: style,
-            ref: ref,
+            style: __cmpls,
+            ref: __cmplr,
             className: (0, _runtime.ax)([
-                \\"_syaz13q2 _1wyb1ul9 _19itlf8h _ca0qftgi _u5f3ftgi _n3tdftgi _19bvftgi\\",
-                props.className
+                \\"_syaz13q2 _1wyb1ul9 _19itlf8h _ca0q1vi7 _u5f31vi7 _n3td1vi7 _19bv1vi7\\",
+                __cmplp.className
             ])
         }));
     });

package/src/index.ts

@@ -1,12 +1,17 @@
-import { join } from 'path';
+import fs from 'fs';
+import { join, dirname } from 'path';
 
 import { parseAsync, transformFromAstAsync } from '@babel/core';
 import generate from '@babel/generator';
 import type { PluginOptions as BabelPluginOptions } from '@compiled/babel-plugin';
-import type { PluginOptions as BabelStripRuntimePluginOptions } from '@compiled/babel-plugin-strip-runtime';
+import type {
+  PluginOptions as BabelStripRuntimePluginOptions,
+  BabelFileMetadata,
+} from '@compiled/babel-plugin-strip-runtime';
 import { toBoolean } from '@compiled/utils';
 import { Transformer } from '@parcel/plugin';
 import SourceMap from '@parcel/source-map';
+import { CachedInputFileSystem, ResolverFactory } from 'enhanced-resolve';
 
 import type { ParcelTransformerOpts } from './types';
 
@@ -45,8 +50,10 @@ export default new Transformer<ParcelTransformerOpts>({
     return false;
   },
 
-  async parse({ asset, config }) {
-    if (!asset.isSource && !config.extract) {
+  async parse({ asset, config, options }) {
+    // Disable stylesheet extraction locally due to https://github.com/atlassian-labs/compiled/issues/1306
+    const extract = config.extract && options.mode !== 'development';
+    if (!asset.isSource && !extract) {
       // Only parse source (pre-built code should already have been baked) or if stylesheet extraction is enabled
       return undefined;
     }
@@ -75,7 +82,7 @@ export default new Transformer<ParcelTransformerOpts>({
     };
   },
 
-  async transform({ asset, config }) {
+  async transform({ asset, config, options }) {
     const ast = await asset.getAST();
     if (!ast) {
       // We will only receive ASTs for assets we're interested in.
@@ -83,9 +90,21 @@ export default new Transformer<ParcelTransformerOpts>({
       return [asset];
     }
 
+    // Disable stylesheet extraction locally due to https://github.com/atlassian-labs/compiled/issues/1306
+    const extract = config.extract && options.mode !== 'development';
     const includedFiles: string[] = [];
     const code = asset.isASTDirty() ? undefined : await asset.getCode();
 
+    const resolver = ResolverFactory.createResolver({
+      fileSystem: new CachedInputFileSystem(fs, 4000),
+      ...(config.extensions && {
+        extensions: config.extensions,
+      }),
+      ...(config.resolve ?? {}),
+      // This makes the resolver invoke the callback synchronously
+      useSyncFileSystemCalls: true,
+    });
+
     const result = await transformFromAstAsync(ast.program, code, {
       code: true,
       ast: false,
@@ -103,14 +122,19 @@ export default new Transformer<ParcelTransformerOpts>({
           {
             ...config,
             onIncludedFiles: (files: string[]) => includedFiles.push(...files),
+            resolver: {
+              // The resolver needs to be synchronous, as babel plugins must be synchronous
+              resolveSync: (context: string, request: string) => {
+                return resolver.resolveSync({}, dirname(context), request);
+              },
+            },
             cache: false,
           } as BabelPluginOptions,
         ],
-        config.extract && [
+        extract && [
           '@compiled/babel-plugin-strip-runtime',
           {
-            styleSheetPath: 'compiled-css!',
-            compiledRequireExclude: config.ssr,
+            compiledRequireExclude: true,
           } as BabelStripRuntimePluginOptions,
         ],
       ].filter(toBoolean),
@@ -130,6 +154,12 @@ export default new Transformer<ParcelTransformerOpts>({
 
     asset.setCode(output);
 
+    if (extract) {
+      // Store styleRules to asset.meta to be used by @compiled/parcel-optimizer
+      const metadata = result?.metadata as BabelFileMetadata;
+      asset.meta.styleRules = metadata.styleRules;
+    }
+
     return [asset];
   },
 

package/src/types.ts

@@ -1,7 +1,8 @@
 import type { PluginItem } from '@babel/core';
 import type { PluginOptions } from '@compiled/babel-plugin';
+import type { ResolveOptions } from 'enhanced-resolve';
 
-type BabelPluginOpts = Omit<PluginOptions, 'cache' | 'onIncludedFiles'>;
+type BabelPluginOpts = Omit<PluginOptions, 'cache' | 'onIncludedFiles' | 'resolver'>;
 
 export interface ParcelTransformerOpts extends BabelPluginOpts {
   extract?: boolean;
@@ -19,4 +20,16 @@ export interface ParcelTransformerOpts extends BabelPluginOpts {
    * Defaults to `false`.
    */
   ssr?: boolean;
+
+  /**
+   * Will run additional cssnano plugins to normalize CSS during build.
+   *
+   * Default to `true`.
+   */
+  optimizeCss?: boolean;
+
+  /**
+   * Override the default `resolve` used by @compiled/babel-plugin, which is used to statically evaluate import declarations
+   */
+  resolve?: ResolveOptions;
 }