Flattened module structure broke imports on projects that don't contain Angular

[tstirrat15]

Note: for support questions, please use the Universal Slack Channel or https://gitter.im/angular/universal

• I'm submitting a ...

• [x] bug report

• Which parts of preboot are affected by this issue?

• [x] server side

• [x] client side

• [ ] inline

• Do you want to request a feature or report a bug?

Bug

• What is the current behavior?

Error: Cannot find module '@angular/core'
    at Function.Module._resolveFilename (module.js:536:15)
    at Function.Module._load (module.js:466:25)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at /usr/src/app/node_modules/preboot/bundles/preboot.umd.js:2:82
    at Object.<anonymous> (/usr/src/app/node_modules/preboot/bundles/preboot.umd.js:5:2)
    at Module._compile (module.js:635:30)
    at Module._compile (/usr/src/app/node_modules/pirates/lib/index.js:91:24)
    at Module._extensions..js (module.js:646:10)
    at Object.newLoader [as .js] (/usr/src/app/node_modules/pirates/lib/index.js:96:7)
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/usr/src/app/build/webpack:/external "preboot":1:1)

It seems that when the structure of the imports was flattened, the imports weren't made... optional? I'm not sure how these sorts of things actually work. The code it's complaining about is here.

• If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem by creating a github repo.

Use preboot in a repo that doesn't contain angular.

• What is the expected behavior?

The relevant modules import successfully and the missing peer dependencies are ignored.

• What is the motivation / use case for changing the behavior?

See above.

• Please tell us about your environment:

• Browser: [all]

• Language: [ ES6/7 | ES5 ]

• OS: [ Linux ]

• Platform: [NodeJs]

• Other information (e.g. detailed explanation, stacktraces, related issues, suggestions how to fix, links for us to have context, eg. stackoverflow, gitter, etc)

[CaerusKaru]

@tstirrat15 Thank you for catching this. I’m going to look into this this week and hopefully get back to you with a solution. Compatibility with other libraries is a huge priority for us.

[CaerusKaru]

@tstirrat15 Can you provide a minimal reproduction repository so that I can take a look? I don't have much experience building/using preboot outside of Angular

[tstirrat15]

Working on it... I'll let you know when I've got something workable. There aren't many boilerplates out there that have the correct structure, and minimizing them is more of a pain than I was expecting.

[tstirrat15]

https://github.com/tstirrat15/react-preboot-universal-minimal

It might not be completely minimal, but it demonstrates the usage where I've been running into problems.

To run, clone and then yarn && yarn start. You'll see the error in the webpack build (albeit maybe a ways up in the build output - my local was spamming webpack output for reasons that I don't entirely understand). Let me know if you run into any problems.

[CaerusKaru]

@tstirrat15 As an update to this issue, I think our solution is going to be moving the Angular module into a secondary entrypoint to separate out that code from the main package.

I'm waiting on APF v6 to come out before I implement this though, because that may fix the structure issues you're facing.

[tstirrat15]

APF?

Sounds good.

[CaerusKaru]

This will probably be fixed by #84, the gist is that there will be a secondary entrypoint for all of the Angular stuff, that way top-level is just pure JS with no dependencies.

APF stands for Angular Package Format, and it's the way we bundle Preboot 6.0 beta.

[Splaktar]

This is now being worked on in https://github.com/angular/preboot/pull/90 now, which needs some attention via rebase and a possible bundling issue.