- Disable
loadable
in CSR build
- Upgrade packages as many as possible in
react-scripts
- Add babel-istanbul-plugin to support collecting test coverage
- Fix security issues
- Add
Node.js requirement
andScript change
inREADME.md
- Delete the yarn.lock
- Bump up 'lerna' to version 5.1.0
- Bump up 'lerna-changelog' to version 2.2.0
- Bump up 'browserslist' to version 4.16.5
- Bump up 'immer' to version 9.0.6
- Add
- Extract the existing custom features from the BRS fork branch
- Extract custom
ssr
features into backpack-addons folder
- Extract custom
- Added support for loadable components.
- Added
start-ssr
command, to produce Node.js-compatible watched output. Several changes to SSR Webpack config to support. - Defined
typeof window
for browser and SSR environments, enabling dead code elimination (https://webpack.js.org/plugins/define-plugin/#usage) - SSR output always includes hash as part of filename
web
andssr
subpaths for each build's output- Output build 'status files' (
.build-status
, one for web, one for SSR), which can be watched by a Node.js server to know when builds are in progress or completed. - Enabled SRI for SSR builds and support loadable SRI hashes
- Fixed an issue with writing stats json for web bundles due to path updates
- Removed
hard-source-webpack-plugin
(SoUSE_HARD_SOURCE_WEBPACK_PLUGIN
environment variable can't be used any more) - Added
build-ssr
command, to indicate that the build is running in SSR mode,3
steps are required for SSR mode:- Add
ssrEnabled
and set it totrue
(The default isfalse
) inbackpack-react-scripts
configuration inpackage.json
- Add
ssr.js
file tosrc
folder - Keep this as the same as before - Change
build
command tobuild-ssr
command - You should know what you are doing is in SSR mode
- Add
- Extract the existing custom features from the BRS fork branch
- Extract custom features into backpack-addons files
- Add backpack-addons README.md
- Node.js support limits to >=12.
- Implement sassFunctions inside backpack-react-scripts.
- Remove the dependency of bpk-mixins.
- Upgrade node-sass to v6 (node-sass Support Node.js 16), never rely on the peerDenpendecy of node-sass from bpk-mixins, BRS can upgrade node-sass to whatever version it wants.
- Upgraded
sass-loader
tov^10.2.1
, to support developers can set UV_THREADPOOL_SIZE environment variable to improve the performance of compiling Sass to CSS
Deprecated version. Do not use.
- Uninstall
@typescript-eslint/eslint-plugin
and@typescript-eslint/parser
. These must now be provided either by directly installing them in your project or by an upcoming version ofeslint-config-skyscanner
.
- Resolved an issue where generated CSS hashes on class names clashed when using multiple of the same CSS on the page and overriding styles on components. #103
- It solves this by overriding the
getCSSModuleLocalIdent
fromreact-dev-utils/getCSSModuleLocalIdent
to provide the project name as part of the hash that is generated at build. Issue raised with upstream CRA for a integrated fix.
- It solves this by overriding the
- Move
cache-loader
aboveresolve-url-loader
to get the best performance- Note that there is an overhead for saving the reading and saving the cache file, so only use this loader to cache expensive loaders. It is said that
cache-loader
shouldn't deal with all the loaders and only the expensive parts. - Moving
cache-loader
above resolve-url-loader is because cache files it generates after this operation are small and it is faster to read the cache files, and it saves more time thancache-loader
below resolve-url-loader, we can still speed up the process of compiling sass to css since sass-loader is the most expensive
- Note that there is an overhead for saving the reading and saving the cache file, so only use this loader to cache expensive loaders. It is said that
- Apply
cache-loader
on CI- Put
cache-loader
beforesass-loader
sincesass-loader
is the most expensive - Add
SHOULD_USE_CACHE_LOADER
to control if usecache-loader
or not since not all the web projects at Skyscanner have applied the cache strategy
- Put
- Added
ignoreCssWarnings
config item to allow the ability to supress CSS ordering issues when its safe to allow mixed order when it has not effect on output. https://github.com/webpack-contrib/mini-css-extract-plugin#remove-order-warnings
- Fixed an issue where webpack paths in SSR were not being utilised.
- Updated webpack paths to include the new
@skyscanner/bpk
foundations packages.
- Optimize the usage of
thread-loader
to fixbuild:storybook
running failed
- Add
thread-loader
to speed up webpack workflow by bundling in parallels - Add
cache-loader
to speed up local development
- Rebased onto
upstream/master
v4.0.3 (f92c37a6e6636ed1650ffd976c6881f59b1be803)
- Rebased onto
upstream/master
v4.0.1 (de8b2b3f2d0a699284420c19d5b4db0be776e0cf) - Bumped
@svgr/webpack
to v5.5.0
- Fixed an issue where eslint was being shipped, which is not required due to our own linting package.
With this change its is only breaking due to the requirement of needing Jest
to be upgraded to 26.6.0
, nothing else should affect from a consumer perspective.
-
Rebased onto
upstream/master
v4.0.0 (ed958938f642007645dd5ac3466db36202f8754e). -
This release rebases
backpack-react-scripts
on top ofcreate-react-app
v4! The major changes have been summarised in the following blog post: Create React App 4.0 -
The only breaking change is the requirement of Jest to be upgraded. Please follow this guide when upgrading.
- Updated
bpk-mixins
to latest version
- Updated
bpk-mixins
to latest version20.1.5
- Downgraded
sass-loader
to7.3.1
due to issues withnode-sass
and functional changes to options.
Rebased onto upstream/master
v3.4.4 (6c009edface3ed63d0c7046f088c675a63c82fdb)
- Update
resolve-url-loader
to3.1.2
to resolve security vunerability
- Updated
lodash
to latest to resolve vunerabilites.
- Update
terser-webpack-plugin
to2.3.8
to resolve security vunerability - Update
webpack-dev-server
to3.11.0
to resolve security vunerability
- Rebased onto
upstream/master
v3.4.1 (d2f813f8897ffcd2f0b0d2da75d0c44924c92f4d). - This release rebases
backpack-react-scripts
on top ofcreate-react-app
v3! The major changes have been summarised in the following blog post: Create React App 3.0 - Some of these changes are breaking. Please follow this guide when upgrading.
- Reverted change introducted in
7.0.4
that unlockedbabel-loader
version which was causing issues when running BRS scripts
- Unlocked
babel-loader
version to allow in range versions.
- Add the ability to split vendor chunks using
vendorChunkRegex
. Anything that matches the regex will be put in the vendors chunk. See PR from banana project
- Update
node-sass
to4.12.0
to support Node 12 rollout. - Update
fsevents
to1.2.9
to support Node 12 rollout.
- Rebased onto
upstream/master
v2.1.2 (3e1dc990130c45f57c647e847682ded0ba352c7b) - This release rebases
backpack-react-scripts
on top ofcreate-react-app
v2! The major changes have been summarised in the following blog post: Create React App 2.0: Babel 7, Sass, and More. - Some of these changes are breaking. Please follow this guide when upgrading.
- Add css modules to
.css
imports. This is only valid for projects using css modules
- Remove peer dependency warnings
- Remove usage of
bpk-component-grid
- Rebased onto
upstream/master
v1.1.5 (dc74990b89b5c6e143b522c759be3dac2c286514) - Upgraded dependencies, mostly
eslint
based.
backpack-react-scripts
listed inside ofdevDependencies
instead ofdependencies
registerServiceWorker.js
no longer appears in project output
- Rebased onto
upstream/master
v1.1.4 (dfbc71ce2ae07547a8544cce14a1a23fac99e071)
- New
disablePolyfills
config inpackage.json
. You can opt out of including polyfills from the output bundle like so:
"backpack-react-scripts": {
"disablePolyfills": true
}
- New
crossOriginLoading
config inpackage.json
. You can configure cross-origin loading of dynamic chunks:
"backpack-react-scripts": {
"crossOriginLoading": "anonymous"
}
- New
amdExcludes
config inpackage.json
. You can now disable AMD parsing for specific modules like so:
"backpack-react-scripts": {
"amdExcludes": [
"globalize"
]
}
- Use
package.json
name field as value foroutput.jsonpFunction
, this is important for when multiple webpack runtimes from different compilation are used on the same page
- CSS Modules hashing now uses
package.json
name field as a salt
- Added
saddlebag-
prefix to the jest config
- Added
saddlebag-
prefix for saddlebag modules
- Rebased onto
upstream/master
v1.0.17 (4b55193f0ad479f26b0f5e153bb4b152a1ee03e7) - Peer dependency issues with
postcss-less
&sugarss
- Scope the disabling of AMD for
lodash
only
- Prevent lodash imports from leaking on to the global scope, see webpack/webpack#3017 (comment)
- Upgraded
stylelint
to^8.2.0
andstylelint-config-skyscanner
to^1.0.1
- Upgraded
eslint-config-skyscanner
to3.0.0
.
- Rebased onto
upstream/master
(b2c0b3f74b47f0f85e3f17f7d3249b7e536cda05) - Locked
react
&react-dom
versions to^15.0.0
for now
- Fixed issue with classnames not being hashed correctly for projects using CSS Modules
- Upgraded sass-loader to 6.0.6 which fixes peer dependency warning with webpack (caused shrinkwraps to fail)
- Upgraded bpk-mixins to 16.3.1
- Rebased onto
upstream/master
(e8a3e4b2995f4c6e49c0a7ed653a1646a7b5e515)
- Production and SSR builds will now use
optimize-css-assets-webpack-plugin
withcssnano
to optimize output CSS. This gets rid of duplication of global CSS constructs such as keyframes.
- Deprecated BpkHeading and BpkParagraph
- Added BpkText component
- Updated all other Backpack dependencies to latest versions
- Updated eslint-plugin-import to 2.7.0 to fix
npm shrinkwrap --save-dev
- Updated stylelint to 8.0.0 and stylelint-config-skyscanner to 1.0.0
- Mocked CSS Modules for Jest, so snapshot tests include the original class names
- Enabled CSS Modules by default
- You can use the config option
cssModules
to opt out:In this case, Sass files will not be treated as CSS Modules by default. However, you can opt-in on a per-file basis using the naming convention:"backpack-react-scripts": { "cssModules": false }
*.module.scss
. - Backpack components will always be treated as CSS Modules, even if you opt out
- All Backpack components need to be on these versions (or higher) to work:
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- [email protected]
- You can use the config option
- Rebased onto
upstream/master
(f495c15578403cf2dbac211493ae8fb6ac742415)
- Replaced the "babelIncludeRegex" config option in
package.json
with "babelIncludePrefixes". You can now enable transpilation for your dependencies by adding package prefixes like so:{ ... "backpack-react-scripts": { "babelIncludePrefixes": [ "my-module-prefix-", "some-dependency" ] } }
- Upgraded
eslint-config-skyscanner
to2.0.0
which uses thebabel-eslint
parse
- Added
babel-eslint
as dependency so it can be used with ESLint when dynamicimport()
statements are used
- Upgraded
eslint-config-skyscanner
to2.0.0
which uses thebabel-eslint
parse
- Rebased from
upstream/master
(fbaeff2d6ef83ae5dc8213150e0fa6589ed29150) - TLDR; this upgrades the upstream dependency
react-scripts
to^1.0.0
- please read the blog post for a summary of the new features this brings - This is a major release, meaning there are a few breaking changes (summarised below). Please refer to the
react-scripts
changelog for detailed migration documentations.
- The ability to configure "babelIncludeRegex" in package json
- Support for new
bpk-icon
mixin frombpk-mixins
- Rebased from
upstream/0.9.x
(ebebe80383eb15b4759a0cd5ea12015eaac94c0e) - Now moves
react
andreact-dom
from dependencies to devDependencies
- Upgrading
eslint-config-skyscanner
to v1.1.0 - Upgrading
stylelint-config-skyscanner
to v0.1.3 - Upgrading
eslint-plugin-react
to v6.10.3 as undelying issue which caused it to be pinned was resolved - Upgrading
node-sass
to v4.5.0 to make it compatible with latest version ofbpk-mixins
- Upgrading all Backpack dev dependencies:
bpk-component-button
to v1.6.6bpk-component-code
to v0.0.58bpk-component-grid
to v1.0.8bpk-component-heading
to v1.2.7bpk-component-paragraph
to v0.2.1bpk-mixins
to v11.0.2bpk-stylesheets
to v3.2.16
- Upgrading
detect-port
to v1.1.1
- The ability to lint SCSS with
stylelint-config-skyscanner
- run
npm run lint:scss
or justnpm run lint
for both JS and SCSS linting
- run
- The ability to automatically fix many SCSS linting issues using
stylefmt
- run
npm run lint:scss:fix
- run
- The ability to automatically fix many JS linting issues using
eslint --fix
- run
npm run lint:js:fix
- run
- Upgrading
eslint-config-skyscanner
to v1.0.0
- Pinning
eslint-plugin-react
to 6.10.0 to fix indent bug
- The ability to configure "ssrExternals" in package json
- The backpack module regex now works on windows
- Removed backpack logo usage from output template
- There is now an
.editorconfig
in the output template
- Rebased from
upstream/master
(4d7b7544e74db1aaca22e847b233ed1f3b95b72b)- Updates
babel-jest
&&jest
packages to 18.0.0
- Updates
- Upgraded
eslint
&eslint-plugin-react
to 3.12.2 & 6.8.0 respectively
- Added ability to configure "externals" in package json
- Server Side Rendering support (proof of concept):
webpack.config.ssr.js
: This is a duplicate ofwebpack.config.prod.js
modified to target a server side node environmentbuild.js
now checks if anssr.js
file exists at the app root, if so it will compile it in parallel with the optimized browser bundle leaving anssr.js
file in the build directory ready to be required on the server- See the readme for detailed instructions.
- Rebased from
upstream/master
(94c912dc60561c931232caf9cf5442082711227c)- Mostly bug fixes and dependency upgrades, see create-react-app's changelog
(between versions
v0.8.0
->v0.8.4
)
- Mostly bug fixes and dependency upgrades, see create-react-app's changelog
(between versions
- Added base stylesheet scripts to the template so that hover effects work
- Removed eslint from webpack to a separate
npm run lint
task - Swapped out
eslint-config-react-app
in favour ofeslint-config-skyscanner
- A
backpack-react-scripts
specific readme
- Rebased from
upstream/master
(bcc469c9a5c7916ec10786f133769cdda2c80188)- Most notable change is Yarn support
- Reverted nested components dir
- New Backpack template
- Backpack stylesheet and Sass mixin integration
- Backpack button, code, grid, heading & paragraph components integration
.eslintrc
for editor integration- Nested components into
src/components/
dir
- Removed
bundledDependencies
- Customised
react-scripts
package to bebackpack-react-scripts
- Marked all other packages as private
- Sass stylesheet support
- Babel will now compile imports from the
node_modules
folder that match/bpk-*
- Drone build configuration