question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Consuming your library in a local application during development, WebpackDevServer example

See original GitHub issue

Tried to preview a module with npm link on a project that uses not AngularCLI (as it is a Hybrid ng1-ng2 app), but a WebpackDevServer. Everything rebuilds on new package build.

But when page refreshes with built version of package - getting an Error: Unexpected value '[object Object]' imported by the module 'AppModule'. Please add a @NgModule annotation., which is fixed under AngularCLI, by adding --preserve-symlinks flag to ng serve.

Exact same version works great, when built -> pushed to GitHub -> npm upgrade package_name into project.

Maybe you can advice a solution for a Webpack in this case? Would be also great to have a knowledge on Why this is happening.

Issue Analytics

  • State:open
  • Created 6 years ago
  • Reactions:2
  • Comments:7

github_iconTop GitHub Comments

1reaction
raphael-voltcommented, Oct 20, 2017

In .angular-cli.json add:

"defaults": {
    "styleExt": "css",
    "component": {},
    "build": {
      "preserveSymlinks": true
    }
  }

From https://github.com/angular/angular-cli/issues/6195

1reaction
RubenVermeulencommented, Sep 21, 2017

I think be woth missed this in de docs.

" If you get Error: Unexpected value ‘[object Object]’ imported by the module ‘AppModule’. Please add a @NgModule annotation., then try:

$ ng serve --preserve-symlinks

to make sure the consuming application searches for the peer dependencies in the application’s node_modules directory."

Read more comments on GitHub >

github_iconTop Results From Across the Web

Authoring Libraries | webpack
The following guide is meant for library authors looking to streamline their bundling strategy. Authoring a Library. Let's assume that we are writing...
Read more >
[Webpack 5] (minimal repro included!) __webpack_modules ...
__webpack_require__ goes bang attempting to import a library local to our project (i.e. a sibling package in the same lerna monorepo).
Read more >
Using environment variables with Webpack - Prateek Surana
A guide for setting up and using environment variables with Webpack and handling different values for Production and Development ...
Read more >
Webpack-dev-server configure for a library - node.js
I have a problem with the webpack dev server in that I cannot seem to test my library as the library seems to...
Read more >
AEM Project Archetype Front-End Build - Experience League
Front-end development that drives the presentation and behavior of the resulting web site and produces JavaScript and CSS libraries.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found