Unable to use with Embroider

[josemarluedke]

I'm unable to the addon with Embroider.

I get the following error:

loader.js:247 Uncaught (in promise) Error: Could not find module `validated-changeset` imported from `(require)`
    at missingModule (loader.js:247)
    at findModule (loader.js:258)
    at requireModule (loader.js:24)
    at eval (validated-changeset.js:1)
    at Object.../externals/validated-changeset.js (chunk.d43d277549173394342b.js:54)
    at __webpack_require__ (chunk.09f72e9eb933fca58277.js:80)
    at eval (index.js:2)
    at Module../node_modules/ember-changeset-validations/index.js (chunk.e6fc63a2c8085996f721.js:2730)
    at __webpack_require__ (chunk.09f72e9eb933fca58277.js:80)
    at eval (validations.ts:7)

The content of that "validated-chagneset.js" is:

const m = window.require("validated-changeset");

if (m.default && !m.__esModule) {
  m.__esModule = true;
}

module.exports = m;

Version

3.8.1
Embroider: 0.21.0

[snewcomer]

@josemarluedke I'm guessing you still have ember-auto-import in you devDependencies? Do you have a public project to share that we can dig into? If not, I can create one.

[josemarluedke]

@snewcomer Yes, I still have ember-auto-import, but as far as I know that is a no-op when using embroider. I don't have a public project, but I can put one together if you would like.

[barryofguilder]

I just ran into this today when messing around with Embroider in my app that uses ember-changeset 3.10.1. I see that there's an open PR to fix this. Any updates on it?

[snewcomer]

No updates yet. I have to see how to make a plain JS library (validated-changeset) compat with embroider. I still need to dig into this (or get help from somebody else!).

[josemarluedke]

@snewcomer Any new development around this issue?

[snewcomer]

@josemarluedke Looks like #540 passed. Do you happen to know if ember-changeset works here now? I can certainly setup a repo with this if you don't have a readily available example.

[AmauryD]

Exact same problem here Uncaught Error: Could not find module `validated-changeset` imported from `(require). Disabling Embroider fixes the problem.
I've made a simple repo reproducing the error : https://github.com/AmauryD/ember-changeset-embroider-test

[jamemackson]

We are experiencing the same issue here. @snewcomer any ideas on where to continue looking into this one? I'm happy to do some legwork but if you had time to point me in the right direction that would be great.

[snewcomer]

This looks like it might be fixed due to the enormous effort from @SergeAstapov 👏

adopted-ember-addons/ember-changeset-validations#328

[AmauryD]

I'm still having the error after updating my repro repository to latest version.
Thank's for the update by the way :D

My devDependencies :

"devDependencies": {
    "@ember/optional-features": "^2.0.0",
    "@ember/test-helpers": "^2.4.2",
    "@embroider/compat": "^0.47.1",
    "@embroider/core": "^0.47.1",
    "@embroider/webpack": "^0.47.1",
    "@glimmer/component": "^1.0.4",
    "@glimmer/tracking": "^1.0.4",
    "babel-eslint": "^10.1.0",
    "broccoli-asset-rev": "^3.0.0",
    "ember-auto-import": "^2.2.3",
    "ember-changeset": "^4.0.0-beta.0",
    "ember-cli": "~3.28.3",
    "ember-cli-app-version": "^5.0.0",
    "ember-cli-babel": "^7.26.6",
    "ember-cli-dependency-checker": "^3.2.0",
    "ember-cli-htmlbars": "^5.7.1",
    "ember-cli-inject-live-reload": "^2.1.0",
    "ember-cli-sri": "^2.1.1",
    "ember-cli-terser": "^4.0.2",
    "ember-data": "~3.28.0",
    "ember-export-application-global": "^2.0.1",
    "ember-fetch": "^8.1.1",
    "ember-load-initializers": "^2.1.2",
    "ember-maybe-import-regenerator": "^0.1.6",
    "ember-page-title": "^6.2.2",
    "ember-qunit": "^5.1.4",
    "ember-resolver": "^8.0.2",
    "ember-source": "~3.28.0",
    "ember-template-lint": "^3.6.0",
    "ember-welcome-page": "^4.0.0",
    "eslint": "^7.32.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-ember": "^10.5.4",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-prettier": "^3.4.1",
    "eslint-plugin-qunit": "^6.2.0",
    "loader.js": "^4.7.0",
    "npm-run-all": "^4.1.5",
    "prettier": "^2.3.2",
    "qunit": "^2.16.0",
    "qunit-dom": "^1.6.0",
    "webpack": "^5.51.1"
  },

[SergeAstapov]

@AmauryD Interesting enough, this line causes an issue: https://github.com/AmauryD/ember-changeset-embroider-test/blob/main/app/routes/index.js#L3

If I remove import { isChangeset } from 'validated-changeset'; from the app code, then everything just works and I can create and interact with the changeset.

[SergeAstapov]

One more thing to add:
the validated-changeset itself does depend on validated-changeset and does have import ... from 'validated-changeset' statements itself which do not cause any issues.

First idea I have, is that validated-changeset is an addon whereas ember-changeset-embroider-test is an actual app (should be no difference between two booth for ember-auto-import and embroider).

Will try to poke more, just out of curiosity.

[AmauryD]

Yeah that's a strange behavior

routes/index.js

import Route from '@ember/routing/route';
import { isChangeset } from 'validated-changeset';

export default class IndexRoute extends Route {
  model() {
    const ischst = isChangeset({});
    return ischst;
  }
}

controllers/index.js

import Controller from '@ember/controller';
import { Changeset } from 'ember-changeset';

export default class IndexController extends Controller {
  constructor() {
    super();
    const ch = Changeset({});
    console.log(ch);
  }
}

also works, without error. It seems that the 2 lines cannot coexist together in the same file.