diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index 3ebb67c48e9..4b36731013f 100644 --- a/.github/workflows/build.yml +++ b/.github/workflows/build.yml @@ -1,6 +1,10 @@ name: Build -on: [push] +on: + push: + branches: [fork_cra5] + pull_request: + branches: [fork_cra5] jobs: build: @@ -9,7 +13,7 @@ jobs: - uses: actions/checkout@v2 - uses: actions/setup-node@v2 with: - node-version: '14' + node-version: 16.x cache: 'npm' - name: Install npm@8 run: npm i -g npm@8 diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml index d9835010a9c..76a671c267d 100644 --- a/.github/workflows/lint.yml +++ b/.github/workflows/lint.yml @@ -1,6 +1,10 @@ name: Lint -on: [push] +on: + push: + branches: [fork_cra5] + pull_request: + branches: [fork_cra5] jobs: lint: @@ -9,7 +13,7 @@ jobs: - uses: actions/checkout@v2 - uses: actions/setup-node@v2 with: - node-version: '14' + node-version: 16.x cache: 'npm' - name: Install npm@8 run: npm i -g npm@8 diff --git a/packages/babel-plugin-named-asset-import/package.json b/packages/babel-plugin-named-asset-import/package.json index 37e864ae277..873e0af94d6 100644 --- a/packages/babel-plugin-named-asset-import/package.json +++ b/packages/babel-plugin-named-asset-import/package.json @@ -1,6 +1,7 @@ { "name": "babel-plugin-named-asset-import", "version": "0.3.8", + "private": true, "description": "Babel plugin for named asset imports in Create React App", "repository": { "type": "git", diff --git a/packages/babel-preset-react-app/package.json b/packages/babel-preset-react-app/package.json index bf5c87feff3..7b98a15aa89 100644 --- a/packages/babel-preset-react-app/package.json +++ b/packages/babel-preset-react-app/package.json @@ -1,6 +1,7 @@ { "name": "babel-preset-react-app", "version": "10.0.1", + "private": true, "description": "Babel preset used by Create React App", "repository": { "type": "git", diff --git a/packages/confusing-browser-globals/package.json b/packages/confusing-browser-globals/package.json index e7a03fe8fdb..3659d47d285 100644 --- a/packages/confusing-browser-globals/package.json +++ b/packages/confusing-browser-globals/package.json @@ -1,6 +1,7 @@ { "name": "confusing-browser-globals", "version": "1.0.11", + "private": true, "description": "A list of browser globals that are often used by mistake instead of local variables", "license": "MIT", "main": "index.js", diff --git a/packages/cra-template-typescript/package.json b/packages/cra-template-typescript/package.json index 4a56592128e..531667f0359 100644 --- a/packages/cra-template-typescript/package.json +++ b/packages/cra-template-typescript/package.json @@ -1,6 +1,7 @@ { "name": "cra-template-typescript", "version": "1.1.3", + "private": true, "keywords": [ "react", "create-react-app", diff --git a/packages/cra-template/package.json b/packages/cra-template/package.json index 687e19c5a19..4cf195ec7e4 100644 --- a/packages/cra-template/package.json +++ b/packages/cra-template/package.json @@ -1,6 +1,7 @@ { "name": "cra-template", "version": "1.1.3", + "private": true, "keywords": [ "react", "create-react-app", diff --git a/packages/create-react-app/package.json b/packages/create-react-app/package.json index f10768fa9a6..4ee6967b529 100644 --- a/packages/create-react-app/package.json +++ b/packages/create-react-app/package.json @@ -1,6 +1,7 @@ { "name": "create-react-app", "version": "5.0.0", + "private": true, "keywords": [ "react" ], diff --git a/packages/eslint-config-react-app/package.json b/packages/eslint-config-react-app/package.json index 62d9a768ee2..5ffd959ab63 100644 --- a/packages/eslint-config-react-app/package.json +++ b/packages/eslint-config-react-app/package.json @@ -1,6 +1,7 @@ { "name": "eslint-config-react-app", "version": "7.0.0", + "private": true, "description": "ESLint configuration used by Create React App", "repository": { "type": "git", diff --git a/packages/react-app-polyfill/package.json b/packages/react-app-polyfill/package.json index 358de4fa483..084303def0f 100644 --- a/packages/react-app-polyfill/package.json +++ b/packages/react-app-polyfill/package.json @@ -1,6 +1,7 @@ { "name": "react-app-polyfill", "version": "3.0.0", + "private": true, "description": "Polyfills for various browsers including commonly used language features", "repository": { "type": "git", diff --git a/packages/react-dev-utils/package.json b/packages/react-dev-utils/package.json index 8d8a93676c4..742686bba75 100644 --- a/packages/react-dev-utils/package.json +++ b/packages/react-dev-utils/package.json @@ -1,6 +1,7 @@ { "name": "react-dev-utils", "version": "12.0.0", + "private": true, "description": "webpack utilities used by Create React App", "repository": { "type": "git", diff --git a/packages/react-error-overlay/package.json b/packages/react-error-overlay/package.json index 877db51b8fc..44ceabd80ec 100644 --- a/packages/react-error-overlay/package.json +++ b/packages/react-error-overlay/package.json @@ -1,6 +1,7 @@ { "name": "react-error-overlay", "version": "6.0.10", + "private": true, "description": "An overlay for displaying stack frames.", "main": "lib/index.js", "sideEffects": false, diff --git a/packages/react-scripts/CHANGELOG.md b/packages/react-scripts/CHANGELOG.md new file mode 100644 index 00000000000..d5e375947b0 --- /dev/null +++ b/packages/react-scripts/CHANGELOG.md @@ -0,0 +1,647 @@ +# `backpack-react-scripts` Change Log + +## 10.0.0 + +### Features + +- 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` and `ssr` 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 + +- Fixed an issue with writing stats json for web bundles due to path updates + +### Breaking + +- Removed `hard-source-webpack-plugin` (So `USE_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 to `true` (The default is `false`) in `backpack-react-scripts` configuration in `package.json` + - Add `ssr.js` file to `src` folder - Keep this as the same as before + - Change `build` command to `build-ssr` command - You should know what you are doing is in SSR mode + +## 9.6.1 + +- Extract the existing custom features from the BRS fork branch + - Extract custom features into backpack-addons files + - Add backpack-addons README.md + +## 9.6.0 + +- 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](https://github.com/sass/node-sass/releases/tag/v6.0.0)), never rely on the peerDenpendecy of node-sass from bpk-mixins, BRS can upgrade node-sass to whatever version it wants. + +## 9.5.1 + +### Changed + +- Upgraded `sass-loader` to `v^10.2.1`, to support developers can set UV_THREADPOOL_SIZE environment variable to improve the performance of compiling Sass to CSS + +## 9.5.0 + +Deprecated version. Do not use. + +## 9.4.0 + +- 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 of `eslint-config-skyscanner`. + +## 9.3.2 + +### Fixed + +- 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](https://github.com/Skyscanner/backpack-react-scripts/pull/103) + - It solves this by overriding the `getCSSModuleLocalIdent` from `react-dev-utils/getCSSModuleLocalIdent` to provide the project name as part of the hash that is generated at build. [Issue raised](https://github.com/facebook/create-react-app/issues/10190) with upstream CRA for a integrated fix. + +## 9.3.1 + +- Move `cache-loader` above `resolve-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 than `cache-loader` below resolve-url-loader, we can still speed up the process of compiling sass to css since sass-loader is the most expensive + +## 9.3.0 + +- Apply `cache-loader` on CI + - Put `cache-loader` before `sass-loader` since `sass-loader` is the most expensive + - Add `SHOULD_USE_CACHE_LOADER` to control if use `cache-loader` or not since not all the web projects at Skyscanner have applied the cache strategy + +## 9.2.0 + +- 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 + +## 9.1.3 + +- Fixed an issue where webpack paths in SSR were not being utilised. + +## 9.1.2 + +- Updated webpack paths to include the new `@skyscanner/bpk` foundations packages. + +## 9.1.1 + +- Optimize the usage of `thread-loader` to fix `build:storybook` running failed + +## 9.1.0 + +- Add `thread-loader` to speed up webpack workflow by bundling in parallels +- Add `cache-loader` to speed up local development + +## 9.0.3 + +- Rebased onto `upstream/master` v4.0.3 (f92c37a6e6636ed1650ffd976c6881f59b1be803) + +## 9.0.2 + +- Rebased onto `upstream/master` v4.0.1 (de8b2b3f2d0a699284420c19d5b4db0be776e0cf) +- Bumped `@svgr/webpack` to v5.5.0 + +## 9.0.1 + +- Fixed an issue where eslint was being shipped, which is not required due to our own linting package. + +## 9.0.0 + +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. + +### Breaking + +- Rebased onto `upstream/master` v4.0.0 (ed958938f642007645dd5ac3466db36202f8754e). +- This release rebases `backpack-react-scripts` on top of `create-react-app` v4! The major changes have been summarised in the following blog post: + [Create React App 4.0](https://github.com/facebook/create-react-app/blob/master/CHANGELOG.md#400-2020-10-23) + +- **The only breaking change is the requirement of Jest to be upgraded. Please follow [this guide](./docs/migrating-from-v8-to-v9.md) when upgrading.** + +## 8.0.5 + +- Updated `bpk-mixins` to latest version + +## 8.0.4 + +- Updated `bpk-mixins` to latest version `20.1.5` + +## 8.0.3 + +### Fixed + +- Downgraded `sass-loader` to `7.3.1` due to issues with `node-sass` and functional changes to options. + +Rebased onto `upstream/master` v3.4.4 (6c009edface3ed63d0c7046f088c675a63c82fdb) + +- Update `resolve-url-loader` to `3.1.2` to resolve security vunerability + +## 8.0.2 + +### Fixed + +- Updated `lodash` to latest to resolve vunerabilites. + +## 8.0.1 + +### Fixed + +- Update `terser-webpack-plugin` to `2.3.8` to resolve security vunerability +- Update `webpack-dev-server` to `3.11.0` to resolve security vunerability + +## 8.0.0 + +### Breaking + +- Rebased onto `upstream/master` v3.4.1 (d2f813f8897ffcd2f0b0d2da75d0c44924c92f4d). +- This release rebases `backpack-react-scripts` on top of `create-react-app` v3! The major changes have been summarised in the following blog post: + [Create React App 3.0](https://github.com/facebook/create-react-app/blob/master/CHANGELOG.md#300-april-22-2019) +- **Some of these changes are breaking. Please follow [this guide](./migrating-from-v7-to-v8.md) when upgrading.** + +## 7.0.5 - 2020-01-10 + +### Fixed + +- Reverted change introducted in `7.0.4` that unlocked `babel-loader` version which was causing issues when running BRS scripts + +## 7.0.4 + +### Fixed + +- Unlocked `babel-loader` version to allow in range versions. + +## 7.0.3 (November 18, 2019) + +- 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](https://github.skyscannertools.net/dingo/banana/blob/2c5bf3f89bc0d1fec29e7fae27dd5988e99dedec/packages/webapp/package.json#L151) + +## 7.0.1 - 2019-09-18 + +### Fixed + +- Update `node-sass` to `4.12.0` to support Node 12 rollout. +- Update `fsevents` to `1.2.9` to support Node 12 rollout. + +## 7.0.0 - 2019-01-11 + +### Breaking + +- Rebased onto `upstream/master` v2.1.2 (3e1dc990130c45f57c647e847682ded0ba352c7b) +- This release rebases `backpack-react-scripts` on top of `create-react-app` v2! The major changes have been summarised in the following blog post: + [Create React App 2.0: Babel 7, Sass, and More.](https://reactjs.org/blog/2018/10/01/create-react-app-v2.html) +- **Some of these changes are breaking. Please follow [this guide](./migrating-from-v6-to-v7.md) when upgrading.** + +## 6.0.0 - 2018-11-02 + +### Breaking + +- Add css modules to `.css` imports. This is only valid for projects using css modules + +## 5.2.1 - 2018-09-10 + +### Fixed + +- Remove peer dependency warnings +- Remove usage of `bpk-component-grid` + +## 5.2.0 - 2018-09-06 + +### Added + +- Rebased onto `upstream/master` v1.1.5 (dc74990b89b5c6e143b522c759be3dac2c286514) +- Upgraded dependencies, mostly `eslint` based. + +## 5.1.1 - 2018-04-11 + +### Fixed + +- `backpack-react-scripts` listed inside of `devDependencies` instead of `dependencies` +- `registerServiceWorker.js` no longer appears in project output + +## 5.1.0 - 2018-04-10 + +### Added + +- Rebased onto `upstream/master` v1.1.4 (dfbc71ce2ae07547a8544cce14a1a23fac99e071) + +## 5.0.10 - 2018-03-21 + +### Fixed + +- New `disablePolyfills` config in `package.json`. You can opt out of including polyfills from the output bundle like so: + +```json + "backpack-react-scripts": { + "disablePolyfills": true + } +``` + +## 5.0.9 - 2018-03-14 + +### Fixed + +- New `crossOriginLoading` config in `package.json`. You can configure cross-origin loading of dynamic chunks: + +```json + "backpack-react-scripts": { + "crossOriginLoading": "anonymous" + } +``` + +## 5.0.8 - 2018-03-07 + +### Fixed + +- New `amdExcludes` config in `package.json`. You can now disable AMD parsing for specific modules like so: + +```json + "backpack-react-scripts": { + "amdExcludes": [ + "globalize" + ] + } +``` + +## 5.0.7 - 2018-03-06 + +### Fixed + +- Use `package.json` name field as value for `output.jsonpFunction`, this is important for when multiple webpack runtimes from different compilation are used on the same page + +## 5.0.6 - 2018-01-31 + +### Fixed + +- CSS Modules hashing now uses `package.json` name field as a salt + +## 5.0.5 - 2018-01-15 + +### Fixed + +- Added `saddlebag-` prefix to the jest config + +## 5.0.4 - 2018-01-11 + +### Added + +- Added `saddlebag-` prefix for saddlebag modules + +## 5.0.3 - 2017-12-21 + +### Fixed + +- Rebased onto `upstream/master` v1.0.17 (4b55193f0ad479f26b0f5e153bb4b152a1ee03e7) +- Peer dependency issues with `postcss-less` & `sugarss` + +## 5.0.2 - 2017-11-03 + +### Fixed + +- Scope the disabling of AMD for `lodash` only + +## 5.0.1 - 2017-11-02 + +### Fixed + +- Prevent lodash imports from leaking on to the global scope, see https://github.com/webpack/webpack/issues/3017#issuecomment-285954512 +- Upgraded `stylelint` to `^8.2.0` and `stylelint-config-skyscanner` to `^1.0.1` + +## 5.0.0 - 2017-10-30 + +### Breaking + +- Upgraded [`eslint-config-skyscanner`](https://github.com/Skyscanner/eslint-config-skyscanner/blob/master/changelog.md#300---upgraded-esling-config-airbnb-peer-dependencies) to `3.0.0`. + +## 4.0.8 - 2017-10-12 + +### Fixed + +- Rebased onto `upstream/master` (b2c0b3f74b47f0f85e3f17f7d3249b7e536cda05) +- Locked `react` & `react-dom` versions to `^15.0.0` for now + +## 4.0.7 - 2017-08-24 + +### Fixed + +- Fixed issue with classnames not being hashed correctly for projects using CSS Modules + +## 4.0.6 - 2017-08-22 + +### Fixed + +- 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 + +## 4.0.5 - 2017-08-17 + +### Fixed + +- Rebased onto `upstream/master` (e8a3e4b2995f4c6e49c0a7ed653a1646a7b5e515) + +## 4.0.3 - 2017-08-10 + +### Fixed + +- Production and SSR builds will now use `optimize-css-assets-webpack-plugin` with `cssnano` to optimize output CSS. This gets rid of duplication of global CSS constructs such as keyframes. + +## 4.0.2 - 2017-07-28 + +### Fixed + +- Deprecated BpkHeading and BpkParagraph +- Added BpkText component +- Updated all other Backpack dependencies to latest versions + +## 4.0.1 - 2017-07-27 + +### Fixed + +- Updated eslint-plugin-import to 2.7.0 to fix `npm shrinkwrap --save-dev` + +## 4.0.0 - 2017-07-27 + +### Changed + +- Updated stylelint to 8.0.0 and stylelint-config-skyscanner to 1.0.0 + +## 3.0.1 - 2017-07-12 + +### Fixed + +- Mocked CSS Modules for Jest, so snapshot tests include the original class names + +## 3.0.0 - 2017-07-11 + +### Changed + +- Enabled [CSS Modules](https://github.com/css-modules/css-modules) by default + - You can use the config option `cssModules` to opt out: + ``` + "backpack-react-scripts": { + "cssModules": false + } + ``` + 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: `*.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: + - bpk-component-accordion@1.1.0 + - bpk-component-autosuggest@3.0.13 + - bpk-component-badge@0.1.0 + - bpk-component-banner-alert@1.1.0 + - bpk-component-barchart@0.1.0 + - bpk-component-blockquote@0.1.0 + - bpk-component-breakpoint@0.1.22 + - bpk-component-button@1.6.33 + - bpk-component-calendar@3.3.0 + - bpk-component-card@0.1.0 + - bpk-component-checkbox@1.2.0 + - bpk-component-close-button@0.1.0 + - bpk-component-code@0.1.0 + - bpk-component-content-container@1.1.0 + - bpk-component-datepicker@6.1.1 + - bpk-component-fieldset@0.3.1 + - bpk-component-form-validation@0.1.0 + - bpk-component-grid-toggle@0.1.0 + - bpk-component-grid@1.1.0 + - bpk-component-heading@2.1.0 + - bpk-component-horizontal-nav@0.1.0 + - bpk-component-icon@3.7.0 + - bpk-component-input@3.2.1 + - bpk-component-label@3.2.0 + - bpk-component-link@0.6.0 + - bpk-component-list@0.1.0 + - bpk-component-loading-button@0.1.0 + - bpk-component-modal@1.1.0 + - bpk-component-nudger@0.1.0 + - bpk-component-panel@0.1.0 + - bpk-component-paragraph@0.3.0 + - bpk-component-popover@1.1.0 + - bpk-component-progress@0.1.0 + - bpk-component-radio@1.1.0 + - bpk-component-router-link@0.2.0 + - bpk-component-rtl-toggle@0.0.73 + - bpk-component-select@2.1.0 + - bpk-component-spinner@2.1.0 + - bpk-component-star-rating@0.0.3 + - bpk-component-table@0.1.0 + - bpk-component-textarea@0.1.0 + - bpk-component-ticket@0.1.0 + - bpk-component-tooltip@1.1.0 + - bpk-react-utils@2.0.0 + +## 2.0.3 - 2017-07-010 + +### Fixed + +- Rebased onto `upstream/master` (f495c15578403cf2dbac211493ae8fb6ac742415) + +## 2.0.1 - 2017-07-04 + +### Changed + +- 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" + ] + } + } + ``` + +### Changed + +- Upgraded `eslint-config-skyscanner` to `2.0.0` which uses the `babel-eslint` parse + +## 1.0.1 - 2017-06-12 + +### Added + +- Added `babel-eslint` as dependency so it can be used with ESLint when dynamic `import()` statements are used + +### Changed + +- Upgraded `eslint-config-skyscanner` to `2.0.0` which uses the `babel-eslint` parse + +## 1.0.0 - 2017-05-29 + +### Changed + +- Rebased from `upstream/master` (fbaeff2d6ef83ae5dc8213150e0fa6589ed29150) +- TLDR; this upgrades the upstream dependency `react-scripts` to `^1.0.0` - please read the [blog post](https://facebook.github.io/react/blog/2017/05/18/whats-new-in-create-react-app.html) 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](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md#100-may-18-2017) for detailed migration documentations. + - [Ensure application and test files reside in src/](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md#ensure-application-and-test-files-reside-in-src) + - [You can no longer import file content](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md#you-can-no-longer-import-file-content) + - [Confusing window globals can no longer be used without window qualifier](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md#confusing-window-globals-can-no-longer-be-used-without-window-qualifier) + - [Jest snapshot format has changed](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md#how-do-i-make-my-tests-work-with-jest-20) + +## 0.0.19 - 2017-05-02 + +### Added + +- The ability to configure "babelIncludeRegex" in package json + +## 0.0.18 - 2017-04-10 + +### Added + +- Support for new `bpk-icon` mixin from `bpk-mixins` + +## 0.0.17 - 2017-04-06 + +### Fixed + +- Rebased from `upstream/0.9.x` (ebebe80383eb15b4759a0cd5ea12015eaac94c0e) +- Now moves `react` and `react-dom` from dependencies to devDependencies + +## 0.0.16 - 2017-03-30 + +### Added + +- 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](https://github.com/yannickcr/eslint-plugin-react/issues/1117) which caused it to be pinned was resolved +- Upgrading `node-sass` to v4.5.0 to make it compatible with latest version of `bpk-mixins` +- Upgrading all Backpack dev dependencies: + - `bpk-component-button` to v1.6.6 + - `bpk-component-code` to v0.0.58 + - `bpk-component-grid` to v1.0.8 + - `bpk-component-heading` to v1.2.7 + - `bpk-component-paragraph` to v0.2.1 + - `bpk-mixins` to v11.0.2 + - `bpk-stylesheets` to v3.2.16 +- Upgrading `detect-port` to v1.1.1 + +## 0.0.15 - 2017-03-27 + +### Added + +- The ability to lint SCSS with `stylelint-config-skyscanner` + - run `npm run lint:scss` or just `npm run lint` for both JS and SCSS linting +- The ability to automatically fix many SCSS linting issues using `stylefmt` + - run `npm run lint:scss:fix` +- The ability to automatically fix many JS linting issues using `eslint --fix` + - run `npm run lint:js:fix` + +## 0.0.14 - 2017-03-20 + +### Added + +- Upgrading `eslint-config-skyscanner` to v1.0.0 + +### Fixed + +- Pinning `eslint-plugin-react` to 6.10.0 to fix indent bug + +## 0.0.13 - 2017-03-09 + +### Added + +- The ability to configure "ssrExternals" in package json + +## 0.0.12 - 2017-03-01 + +### Fixed + +- The backpack module regex now works on windows + +## 0.0.11 - 2017-02-27 + +### Changed + +- Removed backpack logo usage from output template + +### Added + +- There is now an `.editorconfig` in the output template + +## 0.0.10 - 2017-01-05 + +### Changed + +- Rebased from `upstream/master` (4d7b7544e74db1aaca22e847b233ed1f3b95b72b) + - Updates `babel-jest` && `jest` packages to 18.0.0 +- Upgraded `eslint` & `eslint-plugin-react` to 3.12.2 & 6.8.0 respectively + +### Added + +- Added ability to configure "externals" in package json + +## 0.0.9 - 2016-12-20 + +### Added + +- Server Side Rendering support (proof of concept): + - `webpack.config.ssr.js`: This is a duplicate of `webpack.config.prod.js` modified to target a server side node environment + - `build.js` now checks if an `ssr.js` file exists at the app root, if so it will compile it in parallel with the optimized browser bundle leaving an + `ssr.js` file in the build directory ready to be required on the server + - See the [readme](https://github.com/Skyscanner/backpack-react-scripts/tree/master/packages/react-scripts/template#server-side-rendering-ssr) for detailed instructions. + +## 0.0.8 + +### Changed + +- Rebased from `upstream/master` (94c912dc60561c931232caf9cf5442082711227c) + - Mostly bug fixes and dependency upgrades, see [create-react-app's changelog](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md) + (between versions `v0.8.0` -> `v0.8.4`) + +## 0.0.7 + +### Fixed + +- Added base stylesheet scripts to the template so that hover effects work + +## 0.0.6 + +### Changed + +- Removed eslint from webpack to a separate `npm run lint` task +- Swapped out `eslint-config-react-app` in favour of `eslint-config-skyscanner` + +### Added + +- A `backpack-react-scripts` specific readme + +## 0.0.5 + +### Fixed + +- Rebased from `upstream/master` (bcc469c9a5c7916ec10786f133769cdda2c80188) + - Most notable change is Yarn support + +## 0.0.4 + +### Fixed + +- Reverted nested components dir + +## 0.0.3 + +### Added + +- 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 + +## 0.0.2 + +### Fixed + +- Removed `bundledDependencies` + +## 0.0.1 + +### Changed + +- Customised `react-scripts` package to be `backpack-react-scripts` +- Marked all other packages as private + +### Added + +- Sass stylesheet support +- Babel will now compile imports from the `node_modules` folder that match `/bpk-*` +- Drone build configuration diff --git a/packages/react-scripts/docs/migrating-from-v6-to-v7.md b/packages/react-scripts/docs/migrating-from-v6-to-v7.md new file mode 100644 index 00000000000..9624bc9b681 --- /dev/null +++ b/packages/react-scripts/docs/migrating-from-v6-to-v7.md @@ -0,0 +1,181 @@ +# Migrating from v6 to v7 + +Inside any created `backpack-react-scripts` project that has not been ejected, run: + +``` +npm install --save backpack-react-scripts@^7 +``` + +## Breaking Changes + +Like any major release, `backpack-react-scripts@7` contains a few breaking changes. At least one of them will affect every user, so please scan over these sections to see what is relevant to you. + +### ESLint and Stylelint are no longer included by default, you have to manage them yourself + +We have decoupled ESLint and Stylelint from this release. This is because the rate at which our configs (`eslint-config-skyscanner` and `stylelint-config-skyscanner`) change is much faster than the underlying functionality of `create-react-app`, causing unecessary churn. + +That means that your `npm run lint:js` and `npm run lint:scss` scripts will no longer work if on `eslint-config-skyscanner@^4` or `stylelint-config-skyscanner@^1`. + +If on these older versions of our Skyscanner linting configurations and you do not wish to upgrade in this change you will need to install their peer dependencies. It is however recommended to upgrade to the latest of each, where not only will this not be a problem but you will benefit from the latest linting features and improvements. + +If you do not wish to upgrade then you can install the required peer dependencies using: + +ESLint + +**Note:** `eslint-config-skyscanner-with-prettier` does not require peer dependencies, but has been deprecated in favour of `eslint-config-skyscanner` coming with Prettier inbuild by default from [`v5`](https://github.com/Skyscanner/eslint-config-skyscanner/blob/master/CHANGELOG.md). + +``` +npx install-peerdeps --dev eslint-config-skyscanner@^4 +``` + +Stylelint + +``` +npx install-peerdeps --dev stylelint-config-skyscanner@^1 +``` + +### Polyfills for IE 9, IE 10, and IE 11 are no longer included by default (but you can opt in!) + +We have dropped default support for Internet Explorer 9, 10, and 11. If you still need to support these browsers, follow the instructions below. + +First, install `react-app-polyfill`: + +``` +npm install react-app-polyfill +``` + +Next, place one of the following lines at the very top of `src/index.js`: + +``` +import 'react-app-polyfill/ie9'; // For IE 9-11 support +import 'react-app-polyfill/ie11'; // For IE 11 support +``` + +You can read more about [these polyfills here](https://github.com/facebook/create-react-app/tree/master/packages/react-app-polyfill). + +### Dynamic `import()` of a CommonJS module now has a `.default` property + +[Webpack 4 changed the behavior of import()](https://medium.com/webpack/webpack-4-import-and-commonjs-d619d626b655) to be closer in line with the specification. + +Previously, importing a CommonJS module did not require you specify the default export. In most cases, this is now required. +If you see errors in your application about `... is not a function`, you likely need to update your dynamic import, e.g.: + +``` +const throttle = await import('lodash/throttle'); +// replace with +const throttle = await import('lodash/throttle').then(m => m.default); +``` + +### `require.ensure()` is superseded by dynamic `import()` + +We previously allowed code splitting with a webpack-specific directive, `require.ensure()`. It is now disabled in favor of `import()`. To switch to `import()`, follow the examples below: + +Single Module + +``` +require.ensure(['module-a'], function() { + var a = require('module-a'); + // ... +}); + +// Replace with: +import('module-a').then(a => { + // ... +}); +``` + +Multiple Module + +``` +require.ensure(['module-a', 'module-b'], function() { + var a = require('module-a'); + var b = require('module-b'); + // ... +}); + +// Replace with: +Promise.all([import('module-a'), import('module-b')]).then(([a, b]) => { + // ... +}); +``` + +### The default Jest environment was changed to `jsdom` + +Look at the `test` entry in the `scripts` section of your package.json. +Here's a table how to change it from "before" and "after", depending on what you have there: + +| 6.x (if you have this...) | 7.x (...change it to this!) | +| -------------------------------- | ------------------------------- | +| `react-scripts test --env=jsdom` | `react-scripts test` | +| `react-scripts test` | `react-scripts test --env=node` | + +### Object proxy configuration is superseded by `src/setupProxy.js` + +To check if action is required, look for the `proxy` key in `package.json` and follow this: + +1. I couldn't find a `proxy` key in `package.json` + - No action is required! +2. The value of `proxy` is a string (e.g. `http://localhost:5000`) + - No action is required! +3. The value of `proxy` is an object + - Follow the migration instructions below. + +**It's worth highlighting: if your `proxy` field is a `string`, e.g. `http://localhost:5000`, or you don't have it, skip this section. This feature is still supported and has the same behavior.** + +If your `proxy` is an object, that means you are using the advanced proxy configuration. It has become fully customizable so we removed the limited support for the object-style configuration. Here's how to recreate it. + +First, install `http-proxy-middleware` using npm or Yarn: + +``` +npm install http-proxy-middleware +``` + +Next, create `src/setupProxy.js` and place the following contents in it: + +``` +const proxy = require('http-proxy-middleware'); + +module.exports = function(app) { + // ... +}; +``` + +Now, migrate each entry in your `proxy` object one by one, e.g.: + +``` +"proxy": { + "/api": { + "target": "http://localhost:5000/" + }, + "/*.svg": { + "target": "http://localhost:5000/" + } +} +``` + +Place entries into `src/setupProxy.js` like so: + +``` +const proxy = require('http-proxy-middleware'); + +module.exports = function(app) { + app.use(proxy('/api', { target: 'http://localhost:5000/' })); + app.use(proxy('/*.svg', { target: 'http://localhost:5000/' })); +}; +``` + +You can also use completely custom logic there now! This wasn't possible before. + +### `.mjs` file extension support is removed + +Change the extension of any files in your project using `.mjs` to `.js`. + +It was removed because of inconsistent support from underlying tools. We will add it back after it stops being experimental, and Jest gets built-in support for it. + +### `PropTypes` definitions are now removed in production + +Normally, this shouldn't affect your logic and should make the resulting bundle smaller. However, you may be relying on PropTypes definition for production logic. This is not recommended, and will break now. If a library does it, one possible solution is to file an issue in it with a proposal to use a different field (not propTypes) to signal that the declaration needs to be retained. + +### Node 6 is no longer supported + +Please upgrade to Node 8 (LTS) or later. diff --git a/packages/react-scripts/docs/migrating-from-v7-to-v8.md b/packages/react-scripts/docs/migrating-from-v7-to-v8.md new file mode 100644 index 00000000000..618f6e22706 --- /dev/null +++ b/packages/react-scripts/docs/migrating-from-v7-to-v8.md @@ -0,0 +1,83 @@ +# Migrating from v7 to v8 + +Inside any created `backpack-react-scripts` project that has not been ejected, run: + +``` +npm install --save-dev @skyscanner/backpack-react-scripts@^8.0.0 +``` + +## Breaking Changes + +Like any major release, `backpack-react-scripts@8` contains a few breaking changes. At least one of them will affect every user, so please scan over these sections to see what is relevant to you. + +### Upgrade to Jest 24 + +With this version brings the use of Jest `24.9.0`. Major Jest changes in [Jest v24](https://github.com/facebook/jest/blob/master/CHANGELOG.md#2400) + +You will be required to upgrade to Jest 24 due to some incompatibilies with using mixed versions in BRS and your app, please ensure you upgrade your projects Jest version when you upgrade BRS. + +If you encounter this error during build time then you will be required to make the move to Jest `24`. + +```sh +There might be a problem with the project dependency tree. +It is likely not a bug in Create React App, but something you need to fix locally. + +The backpack-react-scripts package provided by Create React App requires a dependency: + + "babel-jest": "^24.9.0" +``` + +### **New structure in `asset-manifest.json`** + +All asset paths have been moved under the files key in `asset-manifest.json`. + +This will require you to make changes to how you access files from the `asset-manifest` file. + +If in your files you currently use the import similar to the following: + +``` +require('../../client/build/asset-manifest.json') +``` + +with the new version you will need to change it to the following so that it will correctly select the files generated: + +``` +require('../../client/build/asset-manifest.json').files +``` + +If you are mocking using these files in jest you will need to change the structure from: + +``` +jest.mock('../../../client/build/asset-manifest.json', () => ({ 'main.js': 'main.js', 'main.css': 'main.css' })); +``` + +to + +``` +jest.mock('../../../client/build/asset-manifest.json', () => ({ files: { 'main.js': 'main.js', 'main.css': 'main.css' } })); +``` + +## New features + +### SRI (Subresource Integrity) Support + +Backpack React Scripts now has the ability to support [SRI (Subresource Integrity)](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity) that allows for browsers to verify that resources they fetch (for example, from a CDN) are delivered without unexpected manipulation. + +To use this and opt-in a new config option has been added - `sriEnabled`. +This flag sets if SRI is to be used during build to add integrity hash for files. + +- **Note** if this is enabled, `crossOriginLoading` value is overriden with `anonymous` in order for it to output with the integrity value. + +By default this feature is disabled and can be opted in should you wish to use this. + +### Templating + +With this version brings in a feature of create-react-app which is called `templates` this allows you to specify a custom template that will be used for the base of the webapp on generation in which we have created a standard template here under [cra-template-backpack](https://github.com/Skyscanner/cra-template-backpack/) - this repo contains the base standard Backpackified template as in BRS 7 but now separated. + +As templates are the default method when creating react apps our command for running now looks like the following: + +```sh +npx create-react-app my-app --scripts-version=@skyscanner/backpack-react-scripts --template @skyscanner/cra-template-backpack --use-npm +``` + +Where `@skyscanner/cra-template-backpack` is published to the NPM repository diff --git a/packages/react-scripts/docs/migrating-from-v8-to-v9.md b/packages/react-scripts/docs/migrating-from-v8-to-v9.md new file mode 100644 index 00000000000..a7eb786d423 --- /dev/null +++ b/packages/react-scripts/docs/migrating-from-v8-to-v9.md @@ -0,0 +1,40 @@ +# Migrating from v8 to v9 + +Inside any created `backpack-react-scripts` project that has not been ejected, run: + +``` +npm install --save-dev @skyscanner/backpack-react-scripts +``` + +## Breaking Changes + +Like any major release, `backpack-react-scripts@9` contains a few breaking changes. At least one of them will affect every user, so please scan over these sections to see what is relevant to you. + +### Upgrade to Jest 26 + +With this version brings the use of Jest `26.6.0`. Major Jest changes in [Jest v26](https://github.com/facebook/jest/blob/master/CHANGELOG.md#2600) + +The main breaking feature is `resetMocks` is now set to `true` by default in the Jest config. + +**Note:** + +You will be required to upgrade to Jest 26 due to some incompatibilies with using mixed versions in BRS and your app, please ensure you upgrade your projects Jest version when you upgrade BRS. + +If you encounter this error during build time then you will be required to make the move to Jest `26`. + +```sh +There might be a problem with the project dependency tree. +It is likely not a bug in Create React App, but something you need to fix locally. + +The backpack-react-scripts package provided by Create React App requires a dependency: + + "babel-jest": "^26.6.0" +``` + +### Service works + +BRS now uses the Workbox InjectManifest plugin over the GenerateSW plugin + +## New features + +A full list of new features and links can be found [here](https://github.com/facebook/create-react-app/releases/tag/v4.0.0) diff --git a/packages/react-scripts/docs/updating-brs.md b/packages/react-scripts/docs/updating-brs.md new file mode 100644 index 00000000000..f8d022e36bc --- /dev/null +++ b/packages/react-scripts/docs/updating-brs.md @@ -0,0 +1,81 @@ +# Updating Backpack React Scripts. + +## Keeping this fork updated + +We wish to keep this fork updated with the upstream repo to benefit from the ongoing open source development +of `create-react-app`. To keep this fork up to date, please follow the steps below: + +1. Ensure `master` is in sync with `upstream/master`: + + ```sh + git checkout master + git remote add upstream git@github.com:facebook/create-react-app.git + git fetch upstream + git reset --hard upstream/master + git push --force-with-lease + ``` + +1. Rebase `fork` on top of a **tagged release** on `master`: + + ```sh + git checkout fork + git rebase + ``` + + > **Note:** `` should be the SHA-1 of the latest upstream release - _not_ the latest commit i.e. `upstream/master` + +1. Pair with someone else to fix any conflicts and cross examine changes in upstream with changes in our fork. + + > This is the most time consuming part. Take care to make sure you are not regressing any functionality that we have added in our fork. + + 1. When rebasing its important to note the `webpack.config.ssr.js` file is an exact copy of the `webpack.config.js` file with components commented out that are not required for SSR. + + When rebasing its important to do a comparison between these files to ensure that new functionality is available to SSR and enabled where necessary. + + 2. The `package.json` files will all be marked as private for each of the packages except `react-scripts/package.json` this is to prevent lerna from trying to publish new versions of these packages and cause the task to fail due to permissions, as it tries to push to the facebook npms. + +1. Re-name your local, rebased `fork` branch to something else and push it to origin. This will ensure it runs through CI and you can verify your changes. + + ```sh + git branch -m + git push origin + ``` + +1. Finally, when we are confident that the rebase has been successful, re-name your branch back to `fork` and push it to origin: + + ```sh + git branch -m fork + git push --force-with-lease + ``` + +## Releasing a new version of `backpack-react-scripts` + +1. Ensure you have run `npm install` in `root`, `packages/react-error-overlay` and `packages/react-scripts` + + - When doing this make sure you remove the `package-lock.json` files that are created in as we don't want these to be published and checked into git. + +2. Create a new version that you wish to publish by running the following command. Use the [CHANGELOG.md](./CHANGELOG.md) to decide on the nature of the changes since the last release. + + ``` + (cd packages/react-scripts && npm version major|minor|patch) + ``` + + - This will create a new commit which you will need to push to fork but place it on the last commit by running: + + ``` + gcn! && ggf + ``` + +3. To publish a new version of `backpack-react-scripts`, run the following command: + + ``` + npm run publish + ``` + + - If you want to be extra careful, you can publish a prerelease by running this instead: + + ``` + npm run publish -- --canary + ``` + +4. Update the [CHANGELOG.md](./CHANGELOG.md) with the new version, taking care to follow the format of previous releases. diff --git a/tasks/local-registry.sh b/tasks/local-registry.sh index 34bdd260c02..edf63004e70 100644 --- a/tasks/local-registry.sh +++ b/tasks/local-registry.sh @@ -26,5 +26,5 @@ function stopLocalRegistry { function publishToLocalRegistry { git clean -df - ./tasks/publish.sh prerelease --yes --force-publish=* --no-git-tag-version --no-commit-hooks --no-push --exact --dist-tag=latest + ./tasks/publish.sh --force-publish=* --no-git-tag-version --no-commit-hooks --no-push --exact --dist-tag=latest } diff --git a/tasks/publish.sh b/tasks/publish.sh index 0fed73e0078..af3304185f7 100755 --- a/tasks/publish.sh +++ b/tasks/publish.sh @@ -42,4 +42,4 @@ if [ -z $CI ]; then fi # Go! -NPM_CONFIG_OTP="$otp" ./node_modules/.bin/lerna publish "$@" +NPM_CONFIG_OTP="$otp" ./node_modules/.bin/lerna publish from-package "$@"