import issues with single-spa-ember with different ember/ember-cli versions about single-spa-ember HOT 8 CLOSED

I am currently on vacation, but can take a look at this in a few days.

from single-spa-ember.

This thread seems to capture the core issue ember-cli/ember-cli#2077, where in older version of ember-cli we are unable to import anonymous module.

When I manually updated single-spa-ember.js in the bower_components from

define(['exports'], function (exports) {
to
define('single-spa-ember', ['exports'], function (exports) {

the ember-1 app loaded too. I do not know how the transpiler work, but it must be possible to generate name module.

I am also facing some Ember issues when jumping from one app to another because ember seems to extend the global js objects(String, Array etc) but we should be able to fix it by leveraging the unmount hook.

from single-spa-ember.

@dshrestha I've created #4 for giving the AMD bundle a name. Check out this line to see what the new amd bundle looks like.

About the following:

ember seems to extend the global js objects(String, Array etc) but we should be able to fix it by leveraging the unmount hook.

What do you think we could do in the unmount hook to fix this?

from single-spa-ember.

@dshrestha I just tried out that new file inside of https://github.com/CanopyTax/single-spa-examples and define('single-spa-ember', ['exports'], function (exports) { didn't work for me. I had to go back to define(['exports'], function (exports) { in order to get it to work.

Single-spa-examples is using [email protected] -- do you know why I might be seeing that error with that version of ember-cli? What versions of ember-cli are you using?

from single-spa-ember.

@joeldenning for single-spa-ember to work, I had to make the following changes.

1. in bower.json updated
   "dependencies": {
   "single-spa-ember": "https://github.com/CanopyTax/single-spa-ember.git#issue-3"
   }

2. in ember-cli-build.js changed how we import the module
   app.import('bower_components/single-spa-ember/amd/single-spa-ember.js');

Once a build was done, the app was running for me.

As for

ember seems to extend the global js objects(String, Array etc) but we should be able to fix it by leveraging the unmount hook.

I was hoping that disabling of EXTEND_PROTOTYPES (https://guides.emberjs.com/v2.3.0/configuring-ember/disabling-prototype-extensions/) would help but sadly it didn't. I also tried to delete the extended method in the unmount hook from the prototype and that didn't work either. I will have to look into it a bit more.

thanks again.

from single-spa-ember.

@dshrestha I released a fix as https://github.com/CanopyTax/single-spa-ember/releases/tag/v0.2.0. Can you verify if that works for you?

Also:

I was hoping that disabling of EXTEND_PROTOTYPES (https://guides.emberjs.com/v2.3.0/configuring-ember/disabling-prototype-extensions/) would help but sadly it didn't

How so? Ember still overrides the native prototypes even if you tell it not to?

from single-spa-ember.

@joeldenning verified to be working with all 3 ember versions now. We might have to update the documentation slightly though because since the module is exported under the name 'single-spa-ember/src/single-spa-ember', we have to import it in app.js as

import singleSpaEmber from 'single-spa-ember/src/single-spa-ember';

As for the issue even with disabling EXTEND_PROTOTYPES, I get the following error:
Uncaught TypeError: Cannot redefine property: Inflector

The issue is arising from 'ember-inflector/index' module:

define('ember-inflector/index', ['exports', 'ember-inflector/lib/system', 'ember-inflector/lib/ext/string'], function (exports, _system) {
  'use strict';

  Object.defineProperty(exports, "__esModule", {
    value: true
  });
  exports.defaultRules = exports.singularize = exports.pluralize = undefined;


  _system.Inflector.defaultRules = _system.defaultRules;
  
  //CAUSES ISSUE SINCE THIS WAS ALREADY DEFINED IN PREVIOUS EMBER APP
  Object.defineProperty(Ember, 'Inflector', {
    get: function get() {
      Ember.deprecate('Ember.Inflector is deprecated. Please explicitly: import Inflector from \'ember-inflector\';', false, {
        id: 'ember-inflector.globals',
        until: '3.0.0'
      });

      return _system.Inflector;
    }
  });

At one point I thought I had it resolved by removing the imported script tags(the core vendor and app js files) in the unmount hook and using appInstance.reset() before calling appInstance.destroy(), but after a re-build suddenly it didn't work anymore. Maybe I need to do delete window.Ember itself, will give it a try and let you know if it works.

Thanks for the fix. Cheers.

from single-spa-ember.

Apologies for the slow response again -- I updated the docs with 7eb873e#diff-04c6e90faac2675aa89e2176d2eec7d8, let me know if there are any other places I might have missed.

About your code sample, that's an interesting problem that it's trying to define the Inflector property twice and that that throws an error. I wonder if altering the code to do delete Ember.Inflector; Object.defineProperty(Ember, 'Inflector', ...) would work?

from single-spa-ember.