npm @redwoodjs/core 0.34.0
v0.34.0
on Node.js NPM

latest releases: 9.0.0-canary.239, 9.0.0-canary.237, 9.0.0-canary.236...
3 years ago

v0.34 Highlights 🎉

This release includes 47 PRs by 13 contributors (not including even more contributors working on Docs and Tutorial translations). To each of you who are working hard to make this project so amazing, we thank you! 🙌

This also brings us a couple releases shy of a v1.0.0 release candidate. 🤯 We've made a list of the remaining features and breaking changes, which you can follow via the Current Release Sprint project board on GitHub. Once we burn down the columns "On deck" and "In Progress", it'll be time. And we need your help! Look for open Issues in the "On deck" column as well as having a label v1/priority. Everyone is invited to become a Redwood contributor. If you're not sure how to get started, check out the #contributing channels on our Forums and Chat. And keep a lookout for the next Contributing Workshop in a few weeks.

🚀 TypeScript Support reaches 💯

TypeScript fans, your day has come! Thanks to a massive effort by so many of our own RedwoodHeroes™, both JS and TS projects will now get type coverage from the Router to Cells to API to Web to you-name-it.

To spin up a new project with the TS language target (also including generators):

  • yarn create redwood-app [directory] --typescript

Have an existing JS project you want to convert to TS (or run hybrid)? We have you covered:

  1. run the command yarn redwood setup tsconfig
  2. change files to .ts or .tsx as required

Lastly, we need your feedback and help to iron out any bugs and add the final touches. Just drop in on the forum conversation over here.

📢 Bienvenido a Redwood Tutorial

Thanks to the work of @pdjota (and others), the Redwood Tutorial part 1 is now fully translated to Spanish!

If you are interested in helping translate into French, Spanish, Portuguese, or Italian, check out this translation guide and come say "hi!" in the on #tutorial-localization Discord channel

The amazing translation project is all due to the hard work of @clairefro Thanks for helping make Redwood even more amazing, Claire!

Changelog

Added

Changed

Fixed

Package Dependencies

View all Dependency Version Upgrades

Breaking ⚠️

Jest Configuration

Redwood's internal packages went through a major restructuring project in #2769. Most changes are invisible. However, Jest configuration had a breaking change that requires a SuperSimple™ code modification. See the "How to Upgrade" section below

Scaffold Generator Directory Structure

It has been possible to use a directory structure when running yarn redwood generate scaffold <path/model>. In PR #2613, the default behavior changed to always include generated directories within a top-level directory named after the model. For example, if your model name is "post", all your post CRUD components will reside in Post/. You can disable this new default behavior via config. NOTE: the related destroy scaffold command will run according to whichever setting you use, either the new default or the config override.

redwood.toml config to disable the new default: 

[generate]
  nestScaffoldByModel= false

New Cell Updating: defaults to SWR

By default, Cells are now SWR (stale while revalidate). This means that once a Cell renders Success (meaning there's data in the cache), when it refetches its query, it'll still show Success. It won't change to Loading then back to Success, but show stale data instead till the query comes back.

The reason for this change was that it's more in-line with our default fetch policy, cache-and-network, and was the behavior we had prior to Apollo v3. cache and network will return data from the cache and send a network request. This caused Cells to render Loading no matter what — whether or not there was data in the cache. Now, this is no longer the case.

The fact that a Cell is refetching its query is useful to know, so the Success component now gets an extra prop, updating, which you can use to display something like a spinner: 

export const Success = ({ updating }) => {
  return (
    <>
      // your Success render...
      {updating && <Spinner>}
    </>
  )
}

Note that you can opt-out of this behavior by changing your fetch policy to something like network-only or no-cache in beforeQuery: 

export const beforeQuery = (props) => {
  return {
    variables: props,
    fetchPolicy: 'network-only'
  }
}

How to Upgrade

Code Modifications

1. Modify Jest Config

The Jest config for a project's api/ and web/ need to be updated per #2769

Update api/jest.config.js (see reference file): 

- const { getConfig } = require('@redwoodjs/core')
- 
- const config = getConfig({ type: 'jest', target: 'browser' })
- config.displayName.name = 'api'
- 
- module.exports = config
+ module.exports = require('@redwoodjs/testing/config/jest/api')

Update web/jest.config.js (see reference file): 

- const { getConfig } = require('@redwoodjs/core')
- 
- const config = getConfig({ type: 'jest', target: 'browser' })
- config.displayName.name = 'web'
- 
- module.exports = config
+ module.exports = require('@redwoodjs/testing/config/jest/web')

2. Remove @redwoodjs/api-server

The main API package now includes the api-server package. See #2769

It's not required, but we recommend removing it from api/package.json: 

-    "@redwoodjs/api": "^0.34.0",
-    "@redwoodjs/api-server": "^0.34.0"
+    "@redwoodjs/api": "^0.34.0"

3. Ignore new TS directories api/types and web/types

In PR #2848, projects ignore these directories by default.

Add the following lines to your .gitignore: 

web/types/graphql.d.ts
api/types/graphql.d.ts

Now remove tracking generated types from your git history. Run this command: 

git rm --cached api/types/graphql.d.ts web/types/graphql.d.ts

4. Use Netlify Dev (for projects using Netlify Deployment)

Redwood now has first-class framework detection on Netlify. For full description, see #2712. This change below makes it easier to use Netlify Dev.

Modify your netlify.toml (see reference file): 

[dev]
- command = "yarn rw dev"
+  # To use [Netlify Dev](https://www.netlify.com/products/dev/),
+  # install netlify-cli from https://docs.netlify.com/cli/get-started/#installation
+  # and then use netlify link https://docs.netlify.com/cli/get-started/#link-and-unlink-sites
+  # to connect your local project to a site already on Netlify
+  # then run netlify dev and our app will be accessible on the port specified below
+  framework = "redwoodjs"
+  # Set targetPort to the [web] side port as defined in redwood.toml
+  targetPort = ${config.web.port}
+  # Point your browser to this port to access your RedwoodJS app
+  port = 8888

Upgrade Packages to v0.34.x from v0.33.x

Run the following command within your App's directory: 

yarn redwood upgrade

Upgrading from an earlier version?

Please follow the "how to upgrade" sections for each newer version here 👉 https://github.com/redwoodjs/redwood/releases, as there may be manual code mods needed for each version.

Upgrading to a version that is not the latest?

The command yarn rw upgrade will always upgrade to the latest (i.e. most recent) Redwood version. If you need to upgrade incrementally to an earlier, specific release, use the --tag option. For example, if you need to upgrade from v0.27.0 to v0.28.4, run the following command: 

yarn redwood upgrade --tag 0.28.4

Need help or having trouble upgrading packages?

See this forum topic for manual upgrade instructions and general upgrade help.

Check out latest releases or
releases around @redwoodjs/core 0.34.0

Don't miss a new core release

NewReleases is sending notifications on new releases.

Get notifications