Search code examples
angularng2-bootstrap

Angular 2 error : SyntaxError: Unexpected token <


I know this question is asked about 100 times but i am getting this error. Please check the screenshot.

Error: SyntaxError: Unexpected token < at Object.eval (http://localhost:3000/node_modules/ng2-bootstrap/components/datepicker/date-formatter.js:2:14) at eval (http://localhost:3000/node_modules/ng2-bootstrap/components/datepicker/date-formatter.js:13:4) Evaluating http://localhost:3000/moment Evaluating http://localhost:3000/node_modules/ng2-bootstrap/components/datepicker/date-formatter.js Evaluating http://localhost:3000/node_modules/ng2-bootstrap/components/datepicker/datepicker-inner.js Evaluating http://localhost:3000/node_modules/ng2-bootstrap/components/datepicker/datepicker.js Evaluating http://localhost:3000/node_modules/ng2-bootstrap/components/datepicker/datepicker-popup.js Evaluating http://localhost:3000/node_modules/ng2-bootstrap/components/datepicker.js Evaluating http://localhost:3000/node_modules/ng2-bootstrap/ng2-bootstrap.js Error loading http://localhost:3000/app/main.js

I followed the solution which is given for fixing system config

System.config({
        packages: {
          app: {
            format: 'register',
            defaultExtension: 'js'
          },
          'ng2-bootstrap': {
            defaultExtension: 'js'
          }
        },
        map: {
          // place for ng2 modules mapping
          'ng2-bootstrap': 'node_modules/ng2-bootstrap'
        }
});

but after this solution I am getting the error and the page is not loading...

anyone know the steps to follow then please let me know.


Solution

  • In fact, ng2-boostrap provided a bundled file. Simply add it into a script element and remove the related configuration of SystemJS:

    <script src="node_modules/ng2-bootstrap/bundles/ng2-bootstrap.js"></script>
    
    System.config({
        packages: {
          app: {
            format: 'register',
            defaultExtension: 'js'
          },
          'ng2-bootstrap': {
            defaultExtension: 'js'
          }
        },
        map: {
          // place for ng2 modules mapping
          'ng2-bootstrap': 'node_modules/ng2-bootstrap'
        }
    });
    

    This can be done after installing ng2-bootstrap with npm.