Skip to content

v3.0.0

Latest
Latest
Compare
Choose a tag to compare
@cermakjiri cermakjiri released this 11 Jan 16:14
· 14 commits to master since this release
@ackee/react-scripts@3.0.0
2f36b24

Changelog

👉 AckeeCZ/create-react-app has been upgraded to facebook/create-react-app@5.0.0, see changelog (💥 for breaking changes at least).

@ackee/create-react-app@3.0.0

  • 8588f75 ⬆️ Upgrade to CRA v5.0.0
  • ef3a0c0 ♻️ Fix & refactor optional modules

@ackee/cra-template-typescript@3.0.0

  • 0d95eb5 ⬆️ Upgrade template dependencies
  • 2f4a199 🔧 Update tsconfig based on react-scripts recommendation
  • 8588f75 ⬆️ Upgrade to CRA v5.0.0
  • f3c53ed ✨ Support css extraction in cra-template-typescript
  • d24ba96 ✨ Support loading styles to a specific placeholder in
  • 713bec5 🚚 Standardize name convention of Fela style files to .rules.ts
  • 86a2258 📦 Add fela plugins
  • 3d9f54e ♻️ Import isServerEnv as named import in store.ts
  • d22163f 🏷️ Add useAppSelector and useAppDispatch hooks
  • c4751f7 ♻️ Use Redux toolkit configure store
  • e2ec903 ♻️ Simplify structure of localizations components
  • 37312a1 ✨ new module optional for antd
  • a242908 ♻️ Use Authenticated from petrus instead of HOC
  • ff200e2 ➖ Remove unused @ackee/lucas
  • e2e7408 ✨ Add service-worker module
  • bf777ed ✨ Add network module
  • c150d2e Add REACT_APP_IS_LOCALHOST env var
  • e5b2893 🔥 Don't include @sentry/tracing by default due to bundle size
  • e03c7a9 🚨 Fix undefined children prop
  • 27b5c25 ➖ @ackee/chris (unused)
  • 8036f2e 🏷️ Fix TS type in ErrorBoundary
  • f9edbff ♻️ Refactor sentry implementation in skeleton
  • fb4a7ea ⬆️ Upgrade to antd 4
  • 5dc7bf1 ♻️ Use loglevel instead of console
  • 683c3c7 ⬆️ Upgrade react-final-form-redux-submit package
  • f13dd11 ✨ Add conditional form module
  • 2cbdd65 ✨ Replace redux-form and mateus with final-form
  • ba18684 ✨ Add form module
  • e9b456d ♻️ Use sentry/react error boundary
  • 8e7cba7 ♻️ Use localizations components over HOC
  • b5eb8d5 ♻️ Replace withErrorBoundary hoc with ErrorBoundary component

@ackee/react-scripts@3.0.0

  • 8588f75 ⬆️ Upgrade to CRA v5.0.0
  • ef3a0c0 ♻️ Fix & refactor optional modules
  • 3177c85 ➖ Remove redundant webworker-plugin
  • 0110e8b 🔧 update less-loader options
  • 2e7ebb8 ✨ use @ackee/browserslist-config

Migration guide from 2.x to 3.0.0

  • Version 2.*.* was using fela renderStatic to render CSS files. For this purpose we needed to import CSS to JS as a string and pass it to renderStatic. The solutions caused "blinking" because React had to renderer before the styles were actually processed by a browser. The styles even enlarged the size of Javascript files.
  • Version 3.0.0 returned back to the original idea from official CRA where imported CSS files are loaded by style-loader in dev and extracted to css files via MiniCSSExtractPlugin in production.

@ackee/react-scripts@3.0.0

💥 Breaking changes

  • Replace import css from './some-css-file.css'; with import './some-css-file.css';. We normally do it in src/index.ts. You can do it in components which need a particular style to utilize lazy-loading.
    • Local variables from *.less files can't be used in Javascript anymore.
    • The migration has been already done in cra-template-typescript in #96 PR so you can get inspired there.
  • Possible breaking changes might appear in config/transformWebpackConfig.js your project. It must be compatible with webpack@5.
  • If you have installed @ackee/redux-utils@3.x, upgrade to 3.1.7 or higher. This version doesn't include @ackee/eslint-config among dependencies, thus it won't anymore break resolving of eslint config and its plugins in project.
  • If you have installed @ackee/petrus, upgrade to 5.2.4 or higher. The below versions includes the unwated version of @ackee/redux-utils.
  • Upgrade NODE_BASE_IMAGE in .gitlab-ci.yml to v14.
  • webpack@5 has updated syntax for creating web worker: 
    - const worker =  new Worker('./foo.worker.js', { type: 'module' });
+ const worker = new Worker(new URL('./foo.worker.js', import.meta.url));
  • webpack-bundle-analyzer has been removed, call it with npx instead: 
    - "analyze-bundle": "yarn build:production --stats && webpack-bundle-analyzer build/bundle-stats.json",
+ "analyze-bundle": "yarn build:production --stats && npx webpack-bundle-analyzer build/bundle-stats.json",

🧑‍💻 Recommended actions on your side

  • Now you can enable FAST_REFRESH in .env file.
  • Consider removing resolutions and check if the audit is now passing.

👏 Credits

Contributors

horaklukas, jancama2, and 4 other contributors
Assets 2