Published by seek-oss-ci almost 3 years ago
Prevents typescript from being upgraded to 4.5.x (#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
Published by seek-oss-ci almost 3 years ago
Config files can now be in TypeScript (#655)
Previously, projects were configured using a sku.config.js
file, which exported a config object.
As most projects at SEEK are now TypeScript based, having a JS config file makes it impossible to reuse any of your production code in the config (e.g. routes).
This change makes it possible to use a TypeScript config file, by default sku.config.ts
.
The easiest way to migrate is to change the module exports to a default export:
- // sku.config.js
+ // sku.config.ts
- module.exports = {
+ export default {
clientEntry: 'src/client.tsx',
// ...
}
But sku also now exports a type for the config object, to make it easier to setup and understand the configuration options.
+ import type { SkuConfig } from 'sku';
+
- module.exports = {
+ const config: SkuConfig = {
clientEntry: 'src/client.tsx',
// ...
}
+
+ export default config;
sku init
will now create TypeScript config files by default.
Published by seek-oss-ci about 3 years ago
Include node_modules in node builds (#651)
Previously, sku would only compile code within your src folder, plus any compile packages, for builds targetting the node environment. While this results in faster builds, it can sometimes lead to incorrect versions of packages being resolved due to clashing version range requirements. All node_modules will now included in the compilation by default, ensuring the correct package version is always required.
The old behaviour can be re-enabled via the new externalizeNodeModules
config.
Published by seek-oss-ci about 3 years ago
Re-introduce lint rules requiring React import when using JSX (#631)
As sku v11 moved to the new JSX transform, we removed all lint rules ensuring React
was imported when using JSX. Unfortunately this change only works if all compile packages (e.g. braid-design-system) switch to sku v11 at the same time, which would also constitute a breaking change. To avoid a lot of package update churn, we are re-introducing the need for React
imports when JSX is present.
Update svgo config to remove deprecated "extendDefaultPlugins" utility. (#632)
This requires [email protected], so Unknown builtin plugin "preset-default" specified
errors can be fixed by refreshing the lockfile.
Published by seek-oss-ci about 3 years ago
Remove sku chromatic
script (#629)
Due to changes in the way chromatic is setup, it now makes more sense for consumers to integrate with chromatic directly.
MIGRATION GUIDE
Follow the chromatic install step.
Once installed, you can setup CI as follows
yarn sku build-storybook
yarn chromatic --storybook-build-dir dist-storybook
Your storybook-build-dir
is whatever you configured your storybookTarget
as in sku.config.js
. The default is dist-storybook
.
BREAKING CHANGE
sku chromatic
script is no longer available.
Rename the SkuWebpackPlugin
option supportedBrowsers
to browserslist
(#629)
The SkuWebpackPlugin
now uses the browserslist query as a compile target for Node code as well.
BREAKING CHANGE
If you are consuming the SkuWebpackPlugin
directly, update uses of supportedBrowsers
to use browserslist
instead. If compiling for Node, ensure you pass a valid Node browserslist query (e.g. current node
).
Remove sku playroom
and sku build-playroom
(#629)
BREAKING CHANGE
All playroom scripts have been removed in favour of consumers installing playroom directly. If you'd like to continue using playroom then you can use the SkuWebpackPlugin.
Example config:
// playroom.config.js
const SkuWebpackPlugin = require('sku/webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
module.exports = {
components: './src/components',
outputPath: './dist/playroom',
webpackConfig: () => ({
plugins: [
new MiniCssExtractPlugin(),
new SkuWebpackPlugin({
include: paths.src,
target: 'browser',
browserslist: ['last 2 chrome versions'],
mode: 'development',
displayNamesProd: true,
removeAssertionsInProduction: false,
MiniCssExtractPlugin,
}),
],
}),
};
Remove support for seek-asia-style-guide
(#629)
As seek-asia-style-guide
is no longer used, first class support for it has been removed.
Upgrade to webpack 5 (#629)
All start and build scripts, including storybook will now use webpack 5. Along with the webpack upgrade a lot of other related dependencies have been updated.
MIGRATION GUIDE
While there is no breaking change from a sku perspective, there are many underlying changes that may require attention.
Things to validate before merging:
dangerouslySetWebpackConfig
, check it's working against webpack 5If you are seeing errors mentioning polyfills after upgrading it's likely your app is relying on automatic NodeJS polyfills which were removed in Webpack 5. Reach out in #sku-support
if you're seeing this to discuss options.
Add persistentCache option and enable by default (#629)
The new persistentCache
option will turn on webpack's filesystem caching between runs of sku start
and sku start-ssr
. This should result in much faster dev server start times when the cache is vaild.
BREAKING CHANGE
Unfortunately treat files are not compatible with the persistentCache
option, so it will need to be disabled in your project until you have migrated them to Braid components or .css.ts
files.
// sku.config.js
module.exports = {
persistentCache: false,
};
This limitation only applies to files inside the current project, any treat files within node_modules can be safely ignored.
Update the minimum supported Node version to 12.13.0 (#629)
BREAKING CHANGE
Node 10 is no longer supported
Remove test-ssr
command (#629)
BREAKING CHANGE
The sku test-ssr
command is no longer available. Please use sku test
instead.
Switch to the automatic
JSX React runtime (#629)
This changes how JSX is transformed into valid JavaScript and comes with some performance benefits. It also means that JSX can be used without needing to import React. Read more about the change here.
e.g.
-import React from 'react';
export const MyComponent => <div>MyComponent</div>;
MIGRATION GUIDE
Ensure your app is running React 17. React 16.14 is also supported if required. Now your app should be working but you may be seeing lint errors similar to the following:
'React' is declared but its value is never read
To remove all the redundant react imports use the following codemod:
npx react-codemod update-react-imports
BREAKING CHANGE
The minimum supported version of React is now v16.14.0
.
Upgrade to Jest 27 (#629)
Jest 27 introduces a bunch of new default settings, primarily switching the default test environment from jsdom
to node
. However, sku will remain using jsdom
by default as we feel it makes more sense as a default for UI development. You can read through the Jest 27 release post to see the other breaking changes that have occured.
Remove support for flow (#629)
Files using flow types are no longer supported. Any remaining flow types should be migrated to TypeScript.
Remove @storybook/addon-knobs
in favor of allowing custom addons. (#629)
MIGRATION GUIDE
If you still require the use of @storybook/addon-knobs
you'll first need to install it.
Note: @storybook/addon-knobs
has been deprecated in favor of @storybook/addon-controls
.
yarn add --dev @storybook/addon-knobs
Once installed, inside your sku.config.js
file, pass @storybook/addon-knobs
to the storybookAddons
option.
// sku.config.js
module.exports = {
storybookAddons: ['@storybook/addon-knobs'],
};
Add webpackStats.json
to build-ssr
output (#629)
Running sku build-ssr
will now output a webpackStats.json
alongside the server.js
file which is required to be deployed to the same directory as server.js
.
BREAKING CHANGE
SSR applications must now deploy the webpackStats.json
alongside the server.js
file.
Add storybookAddons
config option (#629)
Custom storybook addons can now be used via the storybookAddons
config option. For example, if you want to use @storybook/addon-essentials
, first install the addon.
yarn add --dev @storybook/addon-essentials
Then add it to your sku.config.js
.
// sku.config.js
module.exports = {
storybookAddons: ['@storybook/addon-essentials'],
};
Add --stats
argument (#629)
You can now override the default webpack stats preset via the --stats
option. This is useful for debugging warnings and build issues. You can pass any valid webpack stats preset.
sku start --stats errors-warnings
The default values are as follows:
start/start-ssr: summary
build/build-ssr: errors-only
Move to faster source maps setting in development (#629)
Previously sku used inline-source-map
in development which is very slow, particularly for rebuilds. Development source maps now use eval-cheap-module-source-map
.
Upgrade to storybook 6 (#629)
Published by seek-oss-ci about 3 years ago
Published by seek-oss-ci over 3 years ago
Published by seek-oss-ci over 3 years ago
Upgrade to Prettier 2.3 (#606)
This will require consumers to run yarn format
to adopt the new Prettier rules. To reduce the mismatch of prettier versions in the future we are unpinning sku's required version, allowing consumers to relock and accept minor and patch updates.
Published by seek-oss-ci over 3 years ago
instanceof
checks inside render (#604)Published by seek-oss-ci over 3 years ago
Group .css.ts
files with styles when ordering imports (#600)
Work around a classnames bug where dynamic class objects are converted to [Object object]
during static render (#602)
Update minimum playroom version (#600)
Published by seek-oss-ci over 3 years ago
Published by seek-oss-ci over 3 years ago
Published by seek-oss-ci over 3 years ago
Add skipPackageCompatibilityCompilation
option (#591)
When running sku build
, sku will compile all your external packages (node_modules
) through @babel/preset-env
. This is to ensure external packages satisfy the browser support policy. However, this can cause very slow builds when large packages are processed. The skipPackageCompatibilityCompilation
option allows you to pass a list of trusted packages to skip this behaviour.
Note:
react
&react-dom
are skipped by default.
Example:
const config = {
skipPackageCompatibilityCompilation: [
'@bloat/very-large-package',
'lodash',
],
};
Published by seek-oss-ci over 3 years ago
calc
optimization (#589)Published by seek-oss-ci over 3 years ago