chisel-scripts 1.0.0-alpha.5 → 1.0.0

package/CHANGELOG.md

@@ -2,6 +2,20 @@
 
 <!-- INSERT-NEW-ENTRIES-HERE -->
 
+## 1.0.0 (2021-12-17)
+
+- Rewrite with Webpack (#509) ([14fa2d0](https://github.com/xfiveco/generator-chisel/commit/14fa2d0)), closes [#509](https://github.com/xfiveco/generator-chisel/issues/509)
+
+## 1.0.0-alpha.8 (2021-12-16)
+
+## 1.0.0-alpha.7 (2020-09-21)
+
+- Add WP dev server test with puppeteer ([dbc0f1d](https://github.com/xfiveco/generator-chisel/commit/dbc0f1d))
+
+## 1.0.0-alpha.6 (2020-08-06)
+
+- Update CSS bundling: use custom loader instead of importer, make fibers optional ([829dc26](https://github.com/xfiveco/generator-chisel/commit/829dc26))
+
 ## 1.0.0-alpha.5 (2020-08-04)
 
 - Add frontend generator and commands tests ([c32fa26](https://github.com/xfiveco/generator-chisel/commit/c32fa26))

package/lib/Service.js

@@ -182,7 +182,17 @@ module.exports = class Service {
 
     const commanderArgs = [...(name ? [name] : []), ...args];
 
-    return this.program.parseAsync(commanderArgs, { from: 'user' });
+    await this.program.parseAsync(commanderArgs, { from: 'user' });
+    if (this.program._actionResults) {
+      const results = await Promise.all(this.program._actionResults);
+      if (results.length === 1) {
+        return results[0];
+      }
+
+      return results;
+    }
+
+    return undefined;
   }
 
   async resolveChainableWebpackConfig() {

package/lib/config/css.js

@@ -1,6 +1,5 @@
 module.exports = (api, options) => {
   api.chainWebpack((webpackConfig) => {
-    const globby = require('globby');
     const path = require('path');
 
     const isProd = process.env.NODE_ENV === 'production';
@@ -11,21 +10,7 @@ module.exports = (api, options) => {
       sassOptions: {
         indentedSyntax: false,
         includePaths: [api.resolve('node_modules')], // TODO: don't use?
-        outputStyle: 'expanded', //  TODO: test postcss and add minifier
-        importer(url, prev, done) {
-          (async () => {
-            if (globby.hasMagic(url)) {
-              const files = (
-                await globby(url, { cwd: path.dirname(prev) })
-              ).sort();
-              done({
-                contents: files.map((file) => `@import '${file}';`).join('\n'),
-              });
-            } else {
-              done(null);
-            }
-          })();
-        },
+        outputStyle: 'expanded',
       },
     };
 
@@ -50,6 +35,9 @@ module.exports = (api, options) => {
       path.join(options.source.base, options.source.assets),
     );
 
+    // Note: thread loader cannot be used right now
+    // https://github.com/webpack-contrib/thread-loader/issues/79
+
     const createCssLoader = (rule, test) => {
       // prettier-ignore
       return webpackConfig.module.rule(rule).test(test)
@@ -78,6 +66,9 @@ module.exports = (api, options) => {
         .loader(require.resolve('sass-loader'))
         .options(sassLoaderOptions)
         .end()
+      .use('sass-glob-loader')
+        .loader(require.resolve('../webpack-loaders/sass-glob-loader.js'))
+        .end();
 
     webpackConfig
       .plugin('extract-css')

package/lib/webpack-loaders/sass-glob-loader.js

@@ -0,0 +1,41 @@
+// Based on https://github.com/mikevercoelen/gulp-sass-glob/blob/255ee047789e69c82d5e3fc87452360ef8c56f41/src/index.js
+
+// we initially used custom dart-sass importer instead of this but there
+// is noticeable performance difference
+
+const path = require('path');
+const globby = require('globby');
+
+const IMPORT_RE = /^([ \t]*(?:\/\*.*)?)@import\s+["']([^"']+(?:\.scss|\.sass)?)["'];?([ \t]*(?:\/[/*].*)?)$/gm;
+
+module.exports = async function sassGlobLoader(content) {
+  // console.log(`Sass glob loader for ${this.resourcePath}`);
+
+  const file = this.resourcePath;
+  const base = path.dirname(file);
+
+  const newContent = content.replace(
+    IMPORT_RE,
+    (importRule, startComment, globPattern, endComment) => {
+      if (globby.hasMagic(globPattern)) {
+        const files = globby.sync(globPattern, { cwd: base }).sort();
+
+        const filesString = files.map((f) => `@import '${f}';`).join('\n');
+
+        // Inlining sources here makes sass build even faster
+        // but breaks source maps
+        // const filesString = files
+        //   .map((f) => fs.readFileSync(path.join(base, f), 'utf8'))
+        //   .join('\n');
+
+        return startComment + filesString + endComment;
+      }
+
+      return importRule;
+    },
+  );
+
+  // console.log(newContent);
+
+  return newContent;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chisel-scripts",
-  "version": "1.0.0-alpha.5",
+  "version": "1.0.0",
   "description": "TODO",
   "bin": {
     "chisel-scripts": "bin/chisel-scripts.js"
@@ -30,13 +30,12 @@
     "@babel/core": "^7.10.2",
     "babel-loader": "^8.1.0",
     "case-sensitive-paths-webpack-plugin": "^2.3.0",
-    "chisel-shared-utils": "^1.0.0-alpha.0",
+    "chisel-shared-utils": "^1.0.0",
     "cli-highlight": "^2.1.4",
     "cliui": "^6.0.0",
     "commander": "^5.1.0",
     "css-loader": "^3.5.3",
     "cssnano": "^4.1.10",
-    "fibers": "^5.0.0",
     "file-loader": "^6.0.0",
     "fs-extra": "^9.0.1",
     "globby": "^11.0.1",
@@ -61,5 +60,8 @@
     "webpack-merge": "^4.2.2",
     "webpackbar": "^4.0.0"
   },
-  "gitHead": "9038a3ab2803b992c9d6cee939d903617e9b8f0f"
+  "optionalDependencies": {
+    "fibers": "^5.0.0"
+  },
+  "gitHead": "a879e91b61e119d27439c9bd9e7298c89776a4fb"
 }