Skip to content

Module parse failed #399

Closed
Closed

Description

@cschroeter

Since a few days this starter project comes up with an error message after I've installed angular2-moment.

ERROR in ./~/angular2-moment/TimeAgoPipe.ts
Module parse failed: /Users/cschroeter/Projects/Playground/angular2-webpack-starter/node_modules/angular2-moment/TimeAgoPipe.ts Line 3: Unexpected token
You may need an appropriate loader to handle this file type.
| /* angular2-moment (c) 2015, 2016 Uri Shaked / MIT Licence */
| 
| import {Pipe, ChangeDetectorRef, PipeTransform, OnDestroy} from 'angular2/core';
| import * as moment from 'moment';
| 
 @ ./src/app/home/home.ts 13:20-58

What I did?

npm i angular2-moment --save


// home.ts
import {TimeAgoPipe} from 'angular2-moment/TimeAgoPipe';
...
pipes: [TimeAgoPipe]

Do you have any idea what the problem could be?

Activity

  1. PatrickJS commented on Mar 9, 2016

    @PatrickJS
    Owner
  2. cschroeter commented on Mar 9, 2016

    @cschroeter
    ContributorAuthor

    Wow that was the fastest reply I've ever gotten :D

    Could you explain what the purpose is of helpers.root('node_modules') and why it fails with the angular2-moment plugin?

  3. PatrickJS commented on Mar 9, 2016

    @PatrickJS
    Owner

    the angular2-moment module is exposing the typescript files directly when it should only be the js files. because of this you need to make sure the typescript loader can see the files (because I excluded them) which means you take a small perf hit now that the typescript loader needs to parse all .ts files in node_modules

  4. cschroeter commented on Mar 9, 2016

    @cschroeter
    ContributorAuthor

    Thanks man !

  5. urish commented on Mar 9, 2016

    @urish

    @gdi2290 do you have any other examples of TypeScript modules which only expose the js files? I am trying to find whether there is any kind of best practice.

    @cschroeter another solution that could work would be to implicitly reference the js file in your code:

    import {TimeAgoPipe} from 'angular2-moment/TimeAgoPipe.js';
    
  6. cschroeter commented on Mar 9, 2016

    @cschroeter
    ContributorAuthor

    @urish Unfortunately this leads to Cannot find module 'angular2-moment/TimeAgoPipe.js'.

    By the way - using angular2-jwt also causes a module parse error.
    Maybe it is "okay" to include node_modules so people don't struggle with this. @gdi2290 Your thoughts on this?

  7. dweitz43 commented on Mar 9, 2016

    @dweitz43
    Contributor

    i have experienced a similar issue to #402 attempting to load css into the App component from ng2-toasty in node_modules, and can work around it by removing node_modules from the exclude array of the css loader, but i realize this causes performance issues and probably is not an optimal production solution.

    Does anyone have an idea of how I should be attempting to load css from node_modules correctly so that I could still exclude node_modules in the css loader? Do I need to load the css from the assets directory instead?

  8. BrainCrumbz commented on Oct 19, 2016

    @BrainCrumbz

    @gdi2290 could you please point to a recent version of webpack config file with the offending line? Or maybe fix the link with the version at that time? Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions