Add support for Meteor 3

css-modules-build-plugin.js

@@ -156,13 +156,13 @@ export default class CssModulesBuildPlugin extends MultiFileCachingCompiler {
     return inputFile.isRoot;
   }
 
-  compileOneFile(inputFile) {
+  async compileOneFile(inputFile) {
     const filesByName = this.filesByName;
 
     this._prepInputFile(inputFile);
     this._preprocessFile(inputFile, filesByName);
     if (inputFile.transpileCssModules !== false) {
-      this._transpileCssModulesToCss(inputFile, filesByName).await();
+      await this._transpileCssModulesToCss(inputFile, filesByName);
     }
 
     const compileResult = this._generateOutput(inputFile);

less-processor.js

@@ -1,4 +1,3 @@
-import Future from 'fibers/future';
 import path from 'path';
 import logger from './logger';
 
@@ -49,28 +48,25 @@ export default class LessProcessor {
     }
   }
 
-  _process(file) {
+  async _process(file) {
     if (file.isPreprocessed) return;
 
-    const {css, map} = this._transpile(file);
+    const { css, map } = await this._transpile(file);
 
     file.contents = css;
     file.sourceMap = map;
     file.isPreprocessed = true;
   }
 
-  _transpile(sourceFile) {
-    const future = new Future();
+  async _transpile(sourceFile) {
+    const promise = new Promise();
     const options = {
       filename: sourceFile.importPath,
       sourceMap: {
         comment: false
       }
     };
 
-    this.less.render(sourceFile.rawContents, options)
-      .then(output => future.return(output), error => future.throw(error));
-
-    return future.wait();
+    return await this.less.render(sourceFile.rawContents, options)
   }
 };

options.js

@@ -104,7 +104,7 @@ function checkSassCompilation(options) {
 
   if (options.enableSassCompilation === true ||
     (Array.isArray(options.enableSassCompilation) && R.intersection(options.enableSassCompilation, options.extensions).length)) {
-    const result = checkNpmPackage('node-sass@>=3.x <=4.x');
+    const result = checkNpmPackage('sass@>=1.69');
     if (result === true) return;
   }
   options.enableSassCompilation = false;

package.js

@@ -1,7 +1,7 @@
 /* globals Package */
 Package.describe({
   name: 'nathantreid:css-modules',
-  version: '4.1.0',
+  version: '5.0.0',
   summary: 'CSS modules implementation. CSS for components!',
   git: 'https://github.com/nathantreid/meteor-css-modules.git',
   documentation: 'README.md'
@@ -10,32 +10,34 @@ Package.describe({
 Package.registerBuildPlugin({
   name: 'mss',
   use: [
-    'babel-compiler@7.0.0',
-    'ecmascript@0.10.0',
-    'caching-compiler@1.1.7_1',
-    'underscore@1.0.9',
+    'babel-compiler',
+    'ecmascript',
+    'caching-compiler',
+    'underscore',
   ],
   npmDependencies: {
-    'app-module-path': '1.0.4',
-    'camelcase': '3.0.0',
-    'cjson': '0.3.3',
-    'colors': '1.1.2',
-    'common-tags': '1.3.1',
-    'css-modules-loader-core': '1.0.0',
+    "app-module-path": "2.2.0",
+    "camelcase": "8.0.0",
+    "cjson": "0.5.0",
+    "colors": "1.4.0",
+    "common-tags": "1.8.2",
+    "css-modules-loader-core": "1.1.0",
+    "lru-cache": "4.0.1",
+    "path-is-absolute": "1.0.1",
+    "postcss": "8.4.32",
+    "postcss-modules-extract-imports": "3.0.0",
+    "postcss-modules-local-by-default": "4.0.3",
+    "postcss-modules-scope": "3.0.0",
+    "postcss-modules-values": "4.0.0",
+    "recursive-readdir": "2.2.3",
+    "semver": "7.5.4",
+    "string-template": "1.0.0",
+
     'json-to-regex': '0.0.2',
     'es6-template-strings': '2.0.1',
     'hasha': '3.0.0',
-    'lru-cache': '2.6.4',
-    'path-is-absolute': '1.0.0',
-    'postcss': '5.1.2',
-    'postcss-modules-local-by-default': '1.1.1',
-    'postcss-modules-extract-imports': '1.0.1',
-    'postcss-modules-scope': '1.0.2',
-    'postcss-modules-values': '1.2.2',
     'ramda': '0.19.0',
-    'recursive-readdir': '1.3.0',
     'shorthash': '0.0.2',
-    'string-template': '1.0.0',
   },
   sources: [
     'sha1.js',
@@ -58,10 +60,10 @@ Package.registerBuildPlugin({
 });
 
 Package.onUse(function (api) {
-  api.versionsFrom('1.6.1');
+  // api.versionsFrom('1.6.1');
   api.use('isobuild:[email protected]');
   api.use([
-    'ecmascript@0.10.0',
+    'ecmascript',
   ]);
 
   api.mainModule('package/main.js');

package.json

@@ -1,57 +1,48 @@
 {
   "name": "meteor-css-modules",
   "version": "0.0.1",
-  "scripts": {
-    "test": "node ./node_modules/mocha/bin/mocha --compilers js:babel-register --require ./test-helpers/babel-hook.js .\\{,!(node_modules)\\**\\}*.tests.js"
-  },
   "devDependencies": {
-    "async": "^2.0.1",
+    "async": "^3.2.5",
     "babel-eslint": "^6.1.2",
     "babel-plugin-syntax-async-functions": "^6.13.0",
     "babel-plugin-syntax-async-generators": "^6.13.0",
-    "babel-plugin-transform-es2015-destructuring": "^6.9.0",
-    "babel-plugin-transform-es2015-modules-commonjs": "^6.11.5",
-    "babel-plugin-transform-object-rest-spread": "^6.8.0",
-    "babel-plugin-transform-regenerator": "^6.11.4",
-    "babel-polyfill": "^6.13.0",
+    "babel-plugin-transform-es2015-destructuring": "^6.23.0",
+    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
+    "babel-plugin-transform-regenerator": "^6.26.0",
+    "babel-polyfill": "^6.26.0",
     "babel-preset-es2015": "^6.13.2",
-    "babel-preset-meteor": "^6.12.0",
-    "babel-project-relative-import": "^2.0.0",
-    "babel-register": "^6.11.6",
-    "babel-runtime": "^6.11.6",
-    "chai": "^3.5.0",
-    "eslint": "^3.3.1",
-    "eslint-config-standard": "^5.3.5",
+    "babel-preset-meteor": "^7.10.1",
+    "babel-project-relative-import": "^2.0.1",
+    "babel-register": "^6.26.0",
+    "babel-runtime": "^6.26.0",
+    "eslint": "^8.55.0",
+    "eslint-config-standard": "^17.1.0",
     "eslint-plugin-async-await": "0.0.0",
-    "eslint-plugin-promise": "^2.0.0",
-    "eslint-plugin-standard": "^2.0.0",
-    "fibers": "^1.0.13",
-    "mocha": "^3.0.2",
-    "mock-require": "^1.3.0",
-    "node-sass": "^3.8.0",
-    "less": "^2.7.1",
-    "ramda": "0.19.0",
-    "standard": "^7.1.2"
+    "eslint-plugin-promise": "^6.1.1",
+    "eslint-plugin-standard": "^4.1.0",
+    "sass": "^1.69.5",
+    "less": "^4.2.0",
+    "ramda": "0.29.1",
+    "standard": "^17.1.0"
   },
   "dependencies": {
-    "app-module-path": "1.0.4",
-    "camelcase": "3.0.0",
-    "cjson": "0.3.3",
-    "colors": "1.1.2",
-    "common-tags": "^1.3.1",
-    "css-modules-loader-core": "1.0.0",
-    "lru-cache": "2.6.4",
-    "path-is-absolute": "^1.0.0",
-    "postcss": "5.0.14",
-    "postcss-modules-extract-imports": "1.0.0",
-    "postcss-modules-local-by-default": "1.0.1",
-    "postcss-modules-scope": "1.0.0",
-    "postcss-modules-values": "1.1.1",
-    "recursive-readdir": "1.3.0",
-    "semver": "^5.3.0",
+    "app-module-path": "2.2.0",
+    "camelcase": "8.0.0",
+    "cjson": "0.5.0",
+    "colors": "1.4.0",
+    "common-tags": "^1.8.2",
+    "css-modules-loader-core": "1.1.0",
+    "lru-cache": "10.1.0",
+    "path-is-absolute": "^1.0.1",
+    "postcss": "8.4.32",
+    "postcss-modules-extract-imports": "3.0.0",
+    "postcss-modules-local-by-default": "4.0.3",
+    "postcss-modules-scope": "3.0.0",
+    "postcss-modules-values": "4.0.0",
+    "recursive-readdir": "2.2.3",
+    "sass": "^1.69.5",
+    "semver": "^7.5.4",
     "string-template": "1.0.0"
-  },
-  "cssModules": {
-    "test": true
   }
 }

scss-processor.js

@@ -9,7 +9,7 @@ export default class ScssProcessor {
     this.fileCache = {};
     this.filesByName = null;
     this.pluginOptions = pluginOptions;
-    this.sass = pluginOptions.enableSassCompilation ? require('node-sass') : null;
+    this.sass = pluginOptions.enableSassCompilation ? require('sass') : null;
   }
 
   isRoot(inputFile) {

stylus-processor.js

@@ -1,4 +1,3 @@
-import Future from 'fibers/future';
 import path from 'path';
 import pluginOptions from './options';
 import logger from './logger';
@@ -50,31 +49,33 @@ export default class StylusProcessor {
     }
   }
 
-  _process(file) {
+  async _process(file) {
     if (file.isPreprocessed) return;
 
-    const { css, sourceMap } = this._transpile(file);
+    const { css, sourceMap } = await this._transpile(file);
     file.contents = css;
     file.sourceMap = sourceMap;
     file.isPreprocessed = true;
   }
 
-  _transpile(sourceFile) {
-    const future = new Future();
+  async _transpile(sourceFile) {
     const options = {
       filename: sourceFile.importPath,
       sourcemap: {
         comment: false
       }
     };
 
-    this.stylus.render(sourceFile.rawContents, options, (err, css) => {
-      if (err) {
-        return future.throw(err);
-      }
-      future.return({ css, sourceMap: this.stylus.sourcemap });
+    const p = new Promise((resolve, reject) => {
+      this.stylus.render(sourceFile.rawContents, options, (err, css) => {
+        if (err) {
+          reject(err);
+        }
+        resolve(css);
+      });
     });
+    const css = await p
 
-    return future.wait();
+    return { css, sourceMap: this.stylus.sourcemap }
   }
 };