@parcel/transformer-css 2.10.2 → 2.11.0

package/lib/CSSTransformer.js

@@ -25,16 +25,16 @@ function _plugin() {
   };
   return data;
 }
-function _lightningcss() {
-  const data = require("lightningcss");
-  _lightningcss = function () {
+function _utils() {
+  const data = require("@parcel/utils");
+  _utils = function () {
     return data;
   };
   return data;
 }
-function _utils() {
-  const data = require("@parcel/utils");
-  _utils = function () {
+function native() {
+  const data = _interopRequireWildcard(require("lightningcss"));
+  native = function () {
     return data;
   };
   return data;
@@ -60,10 +60,15 @@ function _diagnostic() {
   };
   return data;
 }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = new (_plugin().Transformer)({
+const {
+  transform,
+  transformStyleAttribute,
+  browserslistToTargets
+} = native();
+var _default = exports.default = new (_plugin().Transformer)({
   async loadConfig({
     config,
     options
@@ -103,12 +108,14 @@ var _default = new (_plugin().Transformer)({
       shouldScopeHoist: asset.env.shouldScopeHoist,
       sourceMap: asset.env.sourceMap
     });
-    let [code, originalMap] = await Promise.all([asset.getBuffer(), asset.getMap()]);
+    let [code, originalMap] = await Promise.all([asset.getBuffer(), asset.getMap(),
+    // $FlowFixMe native.default is the init function only when bundled for the browser build
+    process.browser && native().default()]);
     let targets = getTargets(asset.env.engines.browsers);
     let res;
     try {
       if (asset.meta.type === 'attr') {
-        res = (0, _lightningcss().transformStyleAttribute)({
+        res = transformStyleAttribute({
           code,
           analyzeDependencies: true,
           errorRecovery: (config === null || config === void 0 ? void 0 : config.errorRecovery) || false,
@@ -140,7 +147,7 @@ var _default = new (_plugin().Transformer)({
             cssModules = cssModulesConfig !== null && cssModulesConfig !== void 0 ? cssModulesConfig : true;
           }
         }
-        res = (0, _lightningcss().transform)({
+        res = transform({
           filename: (0, _utils().normalizeSeparators)(_path().default.relative(options.projectRoot, asset.filePath)),
           code,
           cssModules,
@@ -187,9 +194,9 @@ var _default = new (_plugin().Transformer)({
         });
       }
     }
-    asset.setBuffer(res.code);
+    asset.setBuffer(Buffer.from(res.code));
     if (res.map != null) {
-      let vlqMap = JSON.parse(res.map.toString());
+      let vlqMap = JSON.parse(Buffer.from(res.map).toString());
       let map = new (_sourceMap().default)(options.projectRoot);
       map.addVLQMap(vlqMap);
       if (originalMap) {
@@ -343,7 +350,6 @@ var _default = new (_plugin().Transformer)({
     return assets;
   }
 });
-exports.default = _default;
 let cache = new Map();
 function getTargets(browsers) {
   if (browsers == null) {
@@ -353,7 +359,7 @@ function getTargets(browsers) {
   if (cached != null) {
     return cached;
   }
-  let targets = (0, _lightningcss().browserslistToTargets)((0, _browserslist().default)(browsers));
+  let targets = browserslistToTargets((0, _browserslist().default)(browsers));
   cache.set(browsers, targets);
   return targets;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parcel/transformer-css",
-  "version": "2.10.2",
+  "version": "2.11.0",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
@@ -17,16 +17,22 @@
   "source": "src/CSSTransformer.js",
   "engines": {
     "node": ">= 12.0.0",
-    "parcel": "^2.10.2"
+    "parcel": "^2.11.0"
   },
   "dependencies": {
-    "@parcel/diagnostic": "2.10.2",
-    "@parcel/plugin": "2.10.2",
+    "@parcel/diagnostic": "2.11.0",
+    "@parcel/plugin": "2.11.0",
     "@parcel/source-map": "^2.1.1",
-    "@parcel/utils": "2.10.2",
+    "@parcel/utils": "2.11.0",
     "browserslist": "^4.6.6",
-    "lightningcss": "^1.16.1",
+    "lightningcss": "^1.22.1",
     "nullthrows": "^1.1.1"
   },
-  "gitHead": "a1391ed8a719fc2f976dbadb528ca2dcffa7da12"
+  "devDependencies": {
+    "lightningcss-wasm": "^1.22.1"
+  },
+  "browser": {
+    "lightningcss": "./wasm-wrapper.js"
+  },
+  "gitHead": "f8076f1644cabc944695b5ec82602c8ae32bcf21"
 }

package/src/CSSTransformer.js

@@ -5,22 +5,20 @@ import type {SourceLocation} from '@parcel/types';
 import path from 'path';
 import SourceMap from '@parcel/source-map';
 import {Transformer} from '@parcel/plugin';
-import {
-  transform,
-  transformStyleAttribute,
-  browserslistToTargets,
-  type SourceLocation as LightningSourceLocation,
-} from 'lightningcss';
 import {
   remapSourceLocation,
   relativePath,
   globToRegex,
   normalizeSeparators,
 } from '@parcel/utils';
+import {type SourceLocation as LightningSourceLocation} from 'lightningcss';
+import * as native from 'lightningcss';
 import browserslist from 'browserslist';
 import nullthrows from 'nullthrows';
 import ThrowableDiagnostic, {errorToDiagnostic} from '@parcel/diagnostic';
 
+const {transform, transformStyleAttribute, browserslistToTargets} = native;
+
 export default (new Transformer({
   async loadConfig({config, options}) {
     let conf = await config.getConfigFrom(options.projectRoot + '/index', [], {
@@ -60,6 +58,8 @@ export default (new Transformer({
     let [code, originalMap] = await Promise.all([
       asset.getBuffer(),
       asset.getMap(),
+      // $FlowFixMe native.default is the init function only when bundled for the browser build
+      process.browser && native.default(),
     ]);
 
     let targets = getTargets(asset.env.engines.browsers);
@@ -175,10 +175,10 @@ export default (new Transformer({
       }
     }
 
-    asset.setBuffer(res.code);
+    asset.setBuffer(Buffer.from(res.code));
 
     if (res.map != null) {
-      let vlqMap = JSON.parse(res.map.toString());
+      let vlqMap = JSON.parse(Buffer.from(res.map).toString());
       let map = new SourceMap(options.projectRoot);
       map.addVLQMap(vlqMap);
 

package/wasm-wrapper.js

@@ -0,0 +1,26 @@
+import {transform, transformStyleAttribute} from 'lightningcss-wasm';
+
+export {default, browserslistToTargets} from 'lightningcss-wasm';
+
+// Hydrate Uint8Array into Buffer
+
+function transformWrapper(config) {
+  let result = transform(config);
+  return {
+    ...result,
+    code: Buffer.from(result.code),
+    map: result.map ? Buffer.from(result.map) : result.map,
+  };
+}
+function transformStyleAttributeWrapper(config) {
+  let result = transformStyleAttribute(config);
+  return {
+    ...result,
+    code: Buffer.from(result.code),
+  };
+}
+
+export {
+  transformWrapper as transform,
+  transformStyleAttributeWrapper as transformStyleAttribute,
+};