sku 11.2.0 → 11.2.4

package/.github/workflows/validate.yml

@@ -8,7 +8,7 @@ jobs:
     runs-on: ubuntu-latest
     env:
       CI: true
-    timeout-minutes: 20
+    timeout-minutes: 30
     steps:
       - name: Checkout Repo
         uses: actions/checkout@master

package/CHANGELOG.md

@@ -1,5 +1,36 @@
 # sku
 
+## 11.2.4
+
+### Patch Changes
+
+- Ensure compile packages within nested node_modules are transformed in jest ([#664](https://github.com/seek-oss/sku/pull/664))
+
+- Include `@babel/runtime` in render builds to ensure it is importable ([#664](https://github.com/seek-oss/sku/pull/664))
+
+## 11.2.3
+
+### Patch Changes
+
+- Prevents typescript from being upgraded to 4.5.x ([#662](https://github.com/seek-oss/sku/pull/662))
+
+  Typescript 4.5 has caused a lot of issues with packages included with sku (braid, vanilla-extract) that are caused by a regression that's been introduced in the type checker.
+  It seems to be fixed in 4.6.0-dev, but that won't be available until late February.
+
+  To prevent things blowing up in the meantime, the version of typescript has been update to keep it below 4.5, at least until a patch is released in 4.5
+
+## 11.2.2
+
+### Patch Changes
+
+- The autogenerated tsconfig.json no longer explicitly excludes `node_modules` ([#660](https://github.com/seek-oss/sku/pull/660))
+
+## 11.2.1
+
+### Patch Changes
+
+- Fix loading of TS config files that use node builtins or external dependencies. ([#657](https://github.com/seek-oss/sku/pull/657))
+
 ## 11.2.0
 
 ### Minor Changes

package/config/jest/jestConfig.js

@@ -1,7 +1,9 @@
 const escapeRegex = require('escape-string-regexp');
 const { paths } = require('../../context');
 const slash = '[/\\\\]'; // Cross-platform path delimiter regex
-const compilePackagesRegex = paths.compilePackages.map(escapeRegex).join('|');
+const compilePackagesRegex = paths.compilePackages
+  .map((pkg) => `.*${escapeRegex(pkg)}`)
+  .join('|');
 
 module.exports = {
   testEnvironment: 'jsdom',

package/config/typescript/tsconfig.js

@@ -1,4 +1,4 @@
-const { cwd, getPathFromCwd } = require('../../lib/cwd');
+const { cwd } = require('../../lib/cwd');
 const { paths, rootResolution } = require('../../context');
 const path = require('path');
 
@@ -34,7 +34,6 @@ module.exports = () => {
       target: 'es5',
     },
     include: includePaths,
-    exclude: [getPathFromCwd('node_modules')],
   };
 
   if (rootResolution) {

package/config/webpack/resolveModules.js

@@ -0,0 +1,17 @@
+const modules = ['node_modules'];
+
+try {
+  const skuPath = require.resolve('sku/package.json');
+
+  // If the project is using pnpm then we add the sku node_modules directory
+  // to the modules array. This allows dependecies of sku to be importable
+  // as part of the build process. This is specifically useful for
+  // @babel/plugin-transform-runtime as it inject imports to @babel/runtime.
+  if (skuPath.includes('.pnpm')) {
+    modules.push(path.join(skuPath, '../..'));
+  }
+} catch (e) {
+  // Ignore errors as if sku isn't resolvable then we don't need to apply the pnpm fix
+}
+
+module.exports = modules;

package/config/webpack/webpack.config.js

@@ -24,6 +24,7 @@ const { getVocabConfig } = require('../vocab/vocab');
 const statsConfig = require('./statsConfig');
 const getSourceMapSetting = require('./sourceMaps');
 const getCacheSettings = require('./cache');
+const modules = require('./resolveModules');
 
 const {
   paths,
@@ -161,6 +162,7 @@ const makeWebpackConfig = ({
       },
       resolve: {
         alias: { __sku_alias__clientEntry: paths.clientEntry },
+        modules,
       },
       module: {
         rules: [
@@ -274,6 +276,9 @@ const makeWebpackConfig = ({
               allowlist: [
                 'classnames', // Workaround for https://github.com/JedWatson/classnames/issues/240
 
+                // Include '@babel/runtime' in render builds to workaround ESM imports in html-render-webpack-plugin
+                /@babel\/runtime/,
+
                 // webpack-node-externals compares the `import` or `require` expression to this list,
                 // not the package name, so we map each packageName to a pattern. This ensures it
                 // matches when importing a file within a package e.g. import { Text } from 'seek-style-guide/react'.
@@ -298,6 +303,7 @@ const makeWebpackConfig = ({
       },
       resolve: {
         alias: { __sku_alias__renderEntry: paths.renderEntry },
+        modules,
       },
       module: {
         rules: [

package/config/webpack/webpack.config.ssr.js

@@ -35,6 +35,7 @@ const { getVocabConfig } = require('../vocab/vocab');
 const statsConfig = require('./statsConfig');
 const getSourceMapSetting = require('./sourceMaps');
 const getCacheSettings = require('./cache');
+const modules = require('./resolveModules');
 
 const makeWebpackConfig = ({
   clientPort,
@@ -123,6 +124,9 @@ const makeWebpackConfig = ({
         },
         emitOnErrors: isProductionBuild,
       },
+      resolve: {
+        modules,
+      },
       module: {
         rules: [
           ...(isDevServer
@@ -244,6 +248,7 @@ const makeWebpackConfig = ({
         alias: {
           __sku_alias__serverEntry: paths.serverEntry,
         },
+        modules,
       },
       target: 'node',
       node: {

package/context/index.js

@@ -1,7 +1,7 @@
 const fs = require('fs');
 const path = require('path');
 const chalk = require('chalk');
-const esbuild = require('esbuild');
+const { register } = require('esbuild-register/dist/node');
 const { getPathFromCwd } = require('../lib/cwd');
 const args = require('../config/args');
 const defaultSkuConfig = require('./defaultSkuConfig');
@@ -10,17 +10,6 @@ const validateConfig = require('./validateConfig');
 const defaultCompilePackages = require('./defaultCompilePackages');
 const isCompilePackage = require('../lib/isCompilePackage');
 
-const evaluateConfig = (configSource) => {
-  const exports = {
-    default: {},
-  };
-
-  // eslint-disable-next-line no-eval
-  const moduleExports = eval(configSource);
-
-  return moduleExports || exports.default;
-};
-
 const getSkuConfig = () => {
   let appSkuConfigPath;
   const tsPath = getPathFromCwd('sku.config.ts');
@@ -39,20 +28,14 @@ const getSkuConfig = () => {
     };
   }
 
-  const compiledConfig = esbuild.buildSync({
-    entryPoints: [appSkuConfigPath],
-    bundle: true,
-    write: false,
-    outdir: 'out',
-    target: ['node14'],
-    format: 'cjs',
-  });
+  const { unregister } = register({ target: 'node14' });
+
+  const newConfig = require(appSkuConfigPath);
 
-  const [{ text: configSource }] = compiledConfig.outputFiles;
-  const newConfig = evaluateConfig(configSource);
+  unregister();
 
   return {
-    appSkuConfig: newConfig,
+    appSkuConfig: newConfig.default || newConfig,
     appSkuConfigPath,
   };
 };

package/docs/docs/configuration.md

@@ -201,7 +201,7 @@ The browser URL to open when running `sku start` or `sku start-ssr`. It will def
 
 ## languages
 
-type `Array<string>`
+type `Array<string | { name: string }>`
 
 The languages your application supports.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sku",
-  "version": "11.2.0",
+  "version": "11.2.4",
   "description": "Front-end development toolkit, powered by Webpack, Babel, CSS Modules, Less and Jest",
   "main": "index.js",
   "bin": {
@@ -106,6 +106,7 @@
     "ensure-gitignore": "^1.1.2",
     "env-ci": "^5.0.0",
     "esbuild": "^0.13.13",
+    "esbuild-register": "^3.2.0",
     "escape-string-regexp": "^4.0.0",
     "eslint": "^7.18.0",
     "eslint-config-seek": "^7.0.8",
@@ -150,7 +151,7 @@
     "traverse": "^0.6.6",
     "treat": "^2.0.4",
     "tree-kill": "^1.2.1",
-    "typescript": "^4.1.3",
+    "typescript": ">=4.1.3 <4.5.0",
     "validate-npm-package-name": "^3.0.0",
     "webpack": "^5.47.1",
     "webpack-bundle-analyzer": "^4.4.2",

package/sku-types.d.ts

@@ -192,7 +192,7 @@ export interface SkuConfig {
    *
    * @link https://seek-oss.github.io/sku/#/./docs/configuration?id=languages
    */
-  languages?: string[];
+  languages?: Array<string | { name: string }>;
 
   /**
    * **Only for libraries**