1

How can I integrate bootstrap module and ng2-select module to angular2 5min quickstart because I always have this error:

Unexpected token <(…)


after adding moment :

Error: Unexpected token <(…)Zone.run @ angular2-polyfills.js:1243zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451lib$es6$promise$$internal$$publishRejection @ angular2-polyfills.js:401(anonymous function) @ angular2-polyfills.js:123Zone.run @ angular2-polyfills.js:1243zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262


<script>
  System.config({
    transpiler: 'typescript', 
    typescriptOptions: { emitDecoratorMetadata: true }, 

    packages: {   
      "/angular2": {"defaultExtension": false},

      './app': {
        format: 'register',
        defaultExtension: 'js'
      },
      'node_modules/ag-grid-ng2': {},
      'node_modules/ag-grid': {},
      'node_modules/ng2-select': {},
      'ng2-bootstrap': {"defaultExtension": "ts"}
    },
    map: {
            'ag-grid-ng2': 'node_modules/ag-grid-ng2',
            'ag-grid': 'node_modules/ag-grid',
            'ng2-select': 'node_modules/ng2-select',
            'ng2-bootstrap': 'node_modules/ng2-bootstrap',
    }
  });
  System.import('app/main')
        .then(null, console.error.bind(console));
</script>

and this is what i found in console

Error: Unexpected token <
Evaluating http://localhost:3000/moment
Error loading http://localhost:3000/app/main.js
at addToError (http://localhost:3000/node_modules/systemjs/dist/system.src.js:41:18)
at linkSetFailed (http://localhost:3000/node_modules/systemjs/dist/system.src.js:628:15)
at http://localhost:3000/node_modules/systemjs/dist/system.src.js:563:9
at doDynamicExecute (http://localhost:3000/node_modules/systemjs/dist/system.src.js:711:7)
at link (http://localhost:3000/node_modules/systemjs/dist/system.src.js:910:20)
at doLink (http://localhost:3000/node_modules/systemjs/dist/system.src.js:562:7)
at updateLinkSetOnLoad (http://localhost:3000/node_modules/systemjs/dist/system.src.js:610:18)
at http://localhost:3000/node_modules/systemjs/dist/system.src.js:422:11
at Zone.run (http://localhost:3000/node_modules/angular2/bundles/angular2-polyfills.js:1243:24)
at zoneBoundFn (http://localhost:3000/node_modules/angular2/bundles/angular2-polyfills.js:1220:26)
Undo
  • 25,519
  • 37
  • 106
  • 129
Bouazza
  • 139
  • 1
  • 4
  • 11
  • dup of http://stackoverflow.com/questions/35861237/how-to-get-a-bit-more-help-perhaps/35863541#35863541 and dozens others. please search before asking. – Günter Zöchbauer Mar 08 '16 at 11:06

1 Answers1

3

To use ng2-boostrap, simply install the modules from NPM:

$ npm install ng2-bootstrap ng2-select

You can then configure them in your HTML entry file:

<script>
  System.configure({
    map: {
      'ng2-bootstrap': 'node_modules/ng2-bootstrap',
      'ng2-select': 'node_modules/ng2-select'
    },
    packages: {
      (...)
    }
  });
  System.import(...);
</script>

You have the problem since a module can't be imported. Around your error, you should see what SystemJS tries to load something...

Edit

Following your answer, it appears that you need to configure moment:

<script>
  System.configure({
    map: {
      (...)
      'moment': 'node_modules/moment/moment'
    },
    (...)
  });
</script>

See this question for more details:

this what i found in console after i add moment

Error: Unexpected token <(…)Zone.run @ angular2-polyfills.js:1243zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451lib$es6$promise$$internal$$publishRejection @ angular2-polyfills.js:401(anonymous function) @ angular2-polyfills.js:123Zone.run @ angular2-polyfills.js:1243zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262

the first problem has been solved when i write systemjs config but i did copied some files from my app folder to node_modules\systemjs\dist it's all the files with extension "*.js.map" i don't understand why it doesnt load it by itself and in my command window it tells me that 404 GET *****.js.map ???? have you an idea?

Community
  • 1
  • 1
Thierry Templier
  • 198,364
  • 44
  • 396
  • 360
  • Could provide the complete error message? I mean corresponding request. Something like `angular2-polyfills.js:1243 Uncaught SyntaxError: Unexpected token < Evaluating http://localhost:3000/angular2/http Error loading http://localhost:3000/app/boot.js`. Thanks! – Thierry Templier Mar 08 '16 at 12:56
  • You have a problem with the moment library. You didn't configure it correctly. I updated my answer accordingly... – Thierry Templier Mar 08 '16 at 13:13
  • look i will add what the console told me after i did what you told me i will put it as an answerr – Bouazza Mar 08 '16 at 13:26
  • thanks i already added the answer sorry i am just a new angular 2 user that's why i ask so much and it blocks me please take a look – Bouazza Mar 08 '16 at 13:36
  • Yes, I think you should add this: `'moment': 'node_modules/moment/moment'` in the `map` block of your SystemJS configuration... This should fix your problem – Thierry Templier Mar 08 '16 at 13:38
  • that's what makes me crazy i did all what forums says and it doesnt work – Bouazza Mar 08 '16 at 13:47
  • Can you execute the request regarding moment now? Do you have another error? – Thierry Templier Mar 08 '16 at 13:49
  • Okay, this error corresponds to the load of which module? – Thierry Templier Mar 08 '16 at 16:18
  • now it is ok but i have a question i will update the answer to explain it – Bouazza Mar 09 '16 at 13:08
  • @Bouazza can you tell me your solution? Have the same error. Thx – Yvan Jun 14 '16 at 17:43
  • i had some problem in my system.config i didn't declare it well but now you can see on the new version its not the same on quick start – Bouazza Jun 15 '16 at 10:02