@parcel/transformer-postcss 2.2.0 → 2.3.2

package/lib/PostCSSTransformer.js

@@ -35,16 +35,6 @@ function _plugin() {
   return data;
 }
 
-function _fileSystemLoader() {
-  const data = _interopRequireDefault(require("css-modules-loader-core/lib/file-system-loader"));
-
-  _fileSystemLoader = function () {
-    return data;
-  };
-
-  return data;
-}
-
 function _nullthrows() {
   const data = _interopRequireDefault(require("nullthrows"));
 
@@ -85,16 +75,6 @@ function _postcssValueParser() {
   return data;
 }
 
-function _postcssModules() {
-  const data = _interopRequireDefault(require("postcss-modules"));
-
-  _postcssModules = function () {
-    return data;
-  };
-
-  return data;
-}
-
 var _loadConfig = require("./loadConfig");
 
 var _constants = require("./constants");
@@ -177,10 +157,16 @@ var _default = new (_plugin().Transformer)({
     let cssModules = null;
 
     if (config.hydrated.modules) {
-      asset.meta.cssModulesCompiled = true;
-      plugins.push((0, _postcssModules().default)({
+      asset.meta.cssModulesCompiled = true; // TODO: should this be resolved from the project root?
+
+      let postcssModules = await options.packageManager.require('postcss-modules', asset.filePath, {
+        range: '^4.3.0',
+        saveDev: true,
+        shouldAutoInstall: options.shouldAutoInstall
+      });
+      plugins.push(postcssModules({
         getJSON: (filename, json) => cssModules = json,
-        Loader: createLoader(asset, resolve),
+        Loader: await createLoader(asset, resolve, options),
         generateScopedName: (name, filename) => `${name}_${(0, _hash().hashString)(_path().default.relative(options.projectRoot, filename)).substr(0, 6)}`,
         ...config.hydrated.modules
       }));
@@ -297,8 +283,11 @@ var _default = new (_plugin().Transformer)({
 
 exports.default = _default;
 
-function createLoader(asset, resolve) {
-  return class extends _fileSystemLoader().default {
+async function createLoader(asset, resolve, options) {
+  let {
+    default: FileSystemLoader
+  } = await options.packageManager.require('postcss-modules/build/css-loader-core/loader', asset.filePath);
+  return class extends FileSystemLoader {
     async fetch(composesPath, relativeTo) {
       let importPath = composesPath.replace(/^["']|["']$/g, '');
       let resolved = await resolve(relativeTo, importPath);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parcel/transformer-postcss",
-  "version": "2.2.0",
+  "version": "2.3.2",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
@@ -17,21 +17,19 @@
   "source": "src/PostCSSTransformer.js",
   "engines": {
     "node": ">= 12.0.0",
-    "parcel": "^2.2.0"
+    "parcel": "^2.3.2"
   },
   "dependencies": {
-    "@parcel/hash": "^2.2.0",
-    "@parcel/plugin": "^2.2.0",
-    "@parcel/utils": "^2.2.0",
+    "@parcel/hash": "2.3.2",
+    "@parcel/plugin": "2.3.2",
+    "@parcel/utils": "2.3.2",
     "clone": "^2.1.1",
-    "css-modules-loader-core": "^1.1.0",
     "nullthrows": "^1.1.1",
-    "postcss-modules": "^3.2.2",
-    "postcss-value-parser": "^4.1.0",
+    "postcss-value-parser": "^4.2.0",
     "semver": "^5.7.1"
   },
   "devDependencies": {
-    "postcss": "^8.3.0"
+    "postcss": "^8.4.5"
   },
-  "gitHead": "4745cd3023f8d5a5adcf9e565d5b82d1418dc262"
+  "gitHead": "47379bf8fabeb2cfe03ade8802d942388b153e5b"
 }

package/src/PostCSSTransformer.js

@@ -5,12 +5,10 @@ import type {FilePath, Asset, MutableAsset, PluginOptions} from '@parcel/types';
 import {hashString} from '@parcel/hash';
 import {glob} from '@parcel/utils';
 import {Transformer} from '@parcel/plugin';
-import FileSystemLoader from 'css-modules-loader-core/lib/file-system-loader';
 import nullthrows from 'nullthrows';
 import path from 'path';
 import semver from 'semver';
 import valueParser from 'postcss-value-parser';
-import postcssModules from 'postcss-modules';
 import typeof * as Postcss from 'postcss';
 
 import {load} from './loadConfig';
@@ -79,10 +77,22 @@ export default (new Transformer({
     let cssModules: ?{|[string]: string|} = null;
     if (config.hydrated.modules) {
       asset.meta.cssModulesCompiled = true;
+
+      // TODO: should this be resolved from the project root?
+      let postcssModules = await options.packageManager.require(
+        'postcss-modules',
+        asset.filePath,
+        {
+          range: '^4.3.0',
+          saveDev: true,
+          shouldAutoInstall: options.shouldAutoInstall,
+        },
+      );
+
       plugins.push(
         postcssModules({
           getJSON: (filename, json) => (cssModules = json),
-          Loader: createLoader(asset, resolve),
+          Loader: await createLoader(asset, resolve, options),
           generateScopedName: (name, filename) =>
             `${name}_${hashString(
               path.relative(options.projectRoot, filename),
@@ -196,10 +206,15 @@ export default (new Transformer({
   },
 }): Transformer);
 
-function createLoader(
+async function createLoader(
   asset: MutableAsset,
   resolve: (from: FilePath, to: string) => Promise<FilePath>,
+  options: PluginOptions,
 ) {
+  let {default: FileSystemLoader} = await options.packageManager.require(
+    'postcss-modules/build/css-loader-core/loader',
+    asset.filePath,
+  );
   return class ParcelFileSystemLoader extends FileSystemLoader {
     async fetch(composesPath, relativeTo) {
       let importPath = composesPath.replace(/^["']|["']$/g, '');