New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.
Already on GitHub? Sign in to your account
Every new npm dep needs a unique approach how to add it to ts_devserver #1055
Comments
Thanks for the detailed feedback! Dealing with third-party dependencies is certainly one of our rough edges. First reply: for any package you've installed, we create a
see that a For the For the failure to produce a
even though I do have |
Ah right, cool! Umd targets can be just reused and now it looks like this:
As for nebular, yes they forgot to add So, I've just created 2 patched versions of nebular fork for more convenience. Sources are here: https://github.com/scalio/nebular/commits/fix/bazel
You can add them to package.json, if you want. Like this:
I'm still curious if we need to send them that as PR or it can be fixed just via Bazel rules? |
We've historically sent PRs to get projects to add module names into their UMD boilerplate, but of course it's a never-ending task to try to convert the whole ecosystem so it doesn't scale. We should really make We just need to accept all the module formats and either do a trick on them at install time to provide a label that does the conversion (and make our bundling rules automatically select the converted modules) or teach the ts_devserver (concatjs really) to do module transpilation. Or recommend a more common devserver that knows how to do it (and keeps our scalability guarantee) Could you file a separate issue for why |
Gottcha, thanks! It becomes clearer now. |
馃悶 bug report
Affected Rule
The issue is caused by the rule:Is this a regression?
No
Description
I have just migrated one of our new Angular projects to Bazel and here I want to report all the issues I had with some of npm deps (probably it is the first time those deps are imported in Bazel project, so it might be helpful for someone).
The main issue for most of them is similar to this: angular/angular-bazel-example#56 (
Error: Mismatched anonymous define() module: function
).But I had to find an individual workaround for each of them (see below). I'm curious, maybe there already exists the one common approach how to build any npm dep even with unnamed UMD and I don't know it? Looks like
npm_umd_bundle
is a good candidate, but there are no examples how to use it and still, some modules need other tweaks (see point 1). Or does it make sense to send PR fixes to all modules that don't name their UMD bundle? Would appreciate your help.@nebular/theme
,@nebular/eva-icons
Here is the repro for nebular: scalio/bazel-nx-example#4
For these deps I had to clone nebular repo and add
amd.id
to their rollup bundle. I've also tried several other approaches as well, such as usingnpm_umd_bundle
rule, but unfortunately, it raises the error similar to this: #771 (worth to mention, I'm on latest rules_nodejs).Also, after this helped, I had to fix
intersection-observer
andeva-icons
transitive dependencies.intersection-observer
can be just added toadditional_root_paths
anddata
ofts_devserver
rule.As for
eva-icons
, the issue there is that they export with justeva
name, so adding this UMD shim toscripts
worked out:Btw, I still didn't manage to make eva-icons work in production mode. There is some runtime error I guess with
eva
<->eva-icons
namings:ng2-dragula
,@ngxs
For all angular-related modules, I had to add paths to
angular-metadata.tsconfig.json
like in angular-bazel-example. That's easy after figuring out once that you need to do it. But maybe worth to make better documentation for it or proper error message, cause it may be tricky for the first time.As for
ng2-dragula
, it has adragula
transitive dep with unnamed UMD. But this timenpm_umd_bundle
really helped:immutable
,dom-autoscroller
For these deps
npm_umd_bundle
worked out well too:If this rule is so helpful, maybe still worth to add documentation for it? ;)
(#951)
As for
dom-autoscroller
, also had to add some lines to tsconfig to fix the import error:Here are the lines:
Related issue: #933 (comment)
馃敩 Minimal Reproduction
Here is the repro for nebular: scalio/bazel-nx-example#4
馃實 Your Environment
Operating System:
Output of
bazel version
:Rules version (SHA):
The text was updated successfully, but these errors were encountered: