v7 Plan

[NullVoxPopuli]

Goal:

Migration should be find-and-replace of import paths only, and no change should be needed that's harder than that.

---

• [x] Switch compilation to https://github.com/ef4/decorator-transforms UPDATE: turns out this isn't needed because ember-resources doesn't actually use any decorators internally
  • Smaller dist
  • requires minimum ember-cli-babel 8.2.0
  • this version of ember-cli-babel is still compatible with ember-source @ 3.28 so consumers of ember-resources should be able to upgrade without an issue.
  • ember-resources can't actually have a peer on ember-cli-babel, because ember-cli-babel technically isn't required ... :upside_down_face: but folks with normal apps will care!
• [x] Move (the current implementation of) class-based resources out of ember-resources Ref: https://github.com/NullVoxPopuli/ember-resources/issues/1056
  • [ ] Provide documentation for managing classes with resources
  • [ ] Add to https://tutorial.glimdown.com
  • [x] Move to another library for folks who want to keep using the same APIs
  • This library will have the same 3.28+ support promise, just class-based resources won't be included in the RFC
• [x] Move the utilities out to reactiveweb Ref: https://github.com/NullVoxPopuli/ember-resources/issues/1046
  • more utilities already exist and are encouraged to be added and shared here
  • keeps ember-resources focused on the resource implementation and documentation

Diff

---

Example migration

• if using the utils,

  npm add reactiveweb

• if using class-based resources,

  npm add ember-modify-based-class-resource

task or trackedTask

replace ember-resources/util/ember-concurrency with reactiveweb/ember-concurrency

keepLatest

replace ember-resources/util/keep-latest with reactiveweb/keep-latest

map

replace ember-resources/util/map with reactiveweb/map

trackedFunction

replace ember-resources/util/function with reactiveweb/function

helper

replace ember-resources/util/helper with reactiveweb/helper

debounce

replace ember-resources/util/debounce with reactiveweb/debounce

UpdateFrequency or FrameRate

replace ember-resources/util/fps with reactiveweb/fps

RemoteData or remoteData

replace ember-resouces/util/remote-data with reactiveweb/remote-data

[SergeAstapov]

seems like it's completed?

[NullVoxPopuli]

yup! thanks!

[tniezurawski]

Hey @NullVoxPopuli, I'm upgrading ember-resources in our deps from 5.4.0. As a first step, I'm upgrading through version 6.5.1 but I got an error in the browser:

importing from 'ember-resources/util/ember-concurrency' is deprecated and will be removed in ember-resources@v7. The exact same code and support is available at https://github.com/universal-ember/reactiveweb. pnpm add reactiveweb and then import { task, trackedTask } from 'reactiveweb/ember-concurrency';. See also: https://github.com/NullVoxPopuli/ember-resources/issues/1061

That's obviously here 😅 So I followed the migration examples - added reactiveweb and replaced how we import trackedTask and trackedFunction.

Unfortunately, I got a problem building the project:

Build Error (PackagerRunner) in nodemodules/.pnpm/reactiveweb@1.3.0@babel+core@7.21.3@ember+test-waiters@3.0.2@glimmer+component@1.1.2_@babe_cxdqyqwfb5yb6azq7l7oow45qe/node_modules/reactiveweb/dist/function.js

Module build failed (from ../../../../../../../../[REDACTED-PATH-TO-PROJECT]/node_modules/.pnpm/thread-loader@3.0.4_webpack@5.88.1/node_modules/thread-loader/dist/cjs.js): Thread Loader (Worker 3) $TMPDIR/embroider/040dc0/nodemodules/.pnpm/reactiveweb@1.3.0@babel+core@7.21.3@ember+test-waiters@3.0.2@glimmer+component@1.1.2_@babe_cxdqyqwfb5yb6azq7l7oow45qe/node_modules/reactiveweb/dist/function.js/function.js: Static class blocks are not enabled. Please add @babel/plugin-transform-class-static-block to your configuration. 37 | State container that represents the asynchrony of a trackedFunction 38 | / 39 | class State { | ^ 40 | static { 41 | g(this.prototype, "data", [tracked], function () { 42 | return null;

Fortunately, the error is quite informative so I installed @babel/plugin-transform-class-static-block and added that plugin to the configuration. It builds again 🎉

But, I get another issue in the browser:

Error while processing route: index Could not find module @ember/owner Error: Could not find module @ember/owner at ../externals/missing/@ember/owner.js (http://localhost:4200/[REDACTED]/bb7892c76a4460f74421.js:100394:7) at webpack_require__ (http://localhost:4200/[REDACTED]/292f8541880780ed8d9f.js:23:42) at ./nodemodules/.pnpm/ember-resources@6.5.1@ember+test-waiters@3.0.2@glimmer+component@1.1.2@babel+core@7.21.3_u6nk5xkoqntwh55gvzyorv65ba/node_modules/ember-resources/dist/core/function-based/immediate-invocation.js (http://localhost:4200/[REDACTED]/1efb467e37333c449f0a.js:125501:197) at webpack_require__ (http://localhost:4200/[REDACTED]/292f8541880780ed8d9f.js:23:42) at ./nodemodules/.pnpm/ember-resources@6.5.1@ember+test-waiters@3.0.2@glimmer+component@1.1.2@babel+core@7.21.3_u6nk5xkoqntwh55gvzyorv65ba/node_modules/ember-resources/dist/index.js (http://localhost:4200/[REDACTED]/1efb467e37333c449f0a.js:126406:102) at webpack_require__ (http://localhost:4200/[REDACTED]/292f8541880780ed8d9f.js:23:42) at ./nodemodules/.pnpm/reactiveweb@1.3.0@babel+core@7.21.3@ember+test-waiters@3.0.2@glimmer+component@1.1.2_@babe_cxdqyqwfb5yb6azq7l7oow45qe/node_modules/reactiveweb/dist/ember-concurrency.js (http://localhost:4200/[REDACTED]/1efb467e37333c449f0a.js:131519:73) at webpack_require (http://localhost:4200/[REDACTED]/292f8541880780ed8d9f.js:23:42) at ./services/recent-clients.js (http://localhost:4200/[REDACTED]/bb7892c76a4460f74421.js:89938:87) at webpack_require__ (http://localhost:4200/[REDACTED]/292f8541880780ed8d9f.js:23:42)

It seems like it's pointing to ember-resources 🤔 Not sure what to do now. Have you seen this before?

[NullVoxPopuli]

Static class blocks are not enabled.

you will need

• ember-cli-babel 8.2+
• ember-auto-import 2.7+
• if you're using embroider, a newer @embroider/core and @embroider/compat as well (I forget the exact versions)

I installed @babel/plugin-transform-class-static-block

You should be able to remove this once you upgrade the above two packages

Could not find module @ember/owner Have you seen this before?

yeah, this happens when you node_modules are messed up -- ember-resources is compat with 3.28+, and @ember/owner didn't exist until 4.11, so there is a dependencySatisfies check here: https://github.com/NullVoxPopuli/ember-resources/blob/2754944a0bd71a7ac3161b3313682ac13c3a6974/ember-resources/src/function-based/manager.ts#L25 which chooses between @ember/owner and @ember/application to get getOwner and setOwner so that ember-resources can work without logging deprecations.

To fix, you'll probably want to delete your node_modules, and re-install.

Lemme know what you run in to next!

[tniezurawski]

Thanks @NullVoxPopuli! I manually updated ember-cli-babel and ember-auto-import as you've mentioned but didn't want to guess with embroider packages 😅 I knew they change between Ember 5.1 vs 5.2 so I upgraded and it works 🎉.

Also not sure what are the exact embroider packages but the upgrade did this:

- "@embroider/compat": "^2.1.1",
- "@embroider/core": "^2.1.1",
+ "@embroider/compat": "^3.2.1",
+ "@embroider/core": "^3.2.1",
  "@embroider/router": "^2.1.3",
- "@embroider/webpack": "^2.1.1",
+ "@embroider/webpack": "^3.1.5",