AngularJS Yeoman + Grunt Build Script1014 Invalid Character IE9

Question

I'm getting this error when building an AngularJS project (testing with default grunt uglification and minification settings) in IE 9:

Script1014: Invalid Character

Across two different projects, the line and character always indicates the character immediately following the colon in the first

:"A",

in the minified/uglified vendor javascript.

bower.json dependencies:

"dependencies": { "angular": "1.2.6", "json3": "~3.2.6", "es5-shim": "~2.1.0", "jquery": "~1.10.2", "bootstrap": "~3.0.3", "angular-resource": "1.2.6", "angular-cookies": "1.2.6", "angular-sanitize": "1.2.6", "angular-route": "1.2.6", "moment": "~2.5.0", "ngInfiniteScroll": "1.0.0", "angular-ui": "~0.4.0", "angular-bootstrap": "~0.10.0", "components-font-awesome": "~4.0.3", "select2": "~3.4.5", "angular-animate": "1.2.6" },

index.html vendor js:

<!-- build:js scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/jquery/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/moment/moment.js"></script>
<script src="bower_components/ngInfiniteScroll/ng-infinite-scroll.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="bower_components/select2/select2.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-mocks/angular-mocks.js"></script>
<!-- endbower -->
<script src="bower_components/angular-ui/build/angular-ui.js"></script>
<!-- endbuild -->

Any idea what might be causing the issue or the best way to debug this? Any help is greatly appreciated!

Answer 1

This is a result of known problems with unicode support in IE.

To avoid this issue, you can pass the ascii_only: true option to the uglify task in your Gruntfile.js. The complete uglify section could look like this:

uglify: {
  options: {
    beautify: {
      ascii_only: true,
      quote_keys: true,
      beautify: false
    },
    preserveComments: false,
    compress: false,
    mangle: false
  },
  dist: {
    files: {
      '<%= yeoman.dist %>/scripts/scripts.js': [
        '<%= yeoman.dist %>/scripts/scripts.js'
      ]
    }
  }
}

For more info on these options see the UglifyJS API docs.

Answer 2

Sometime IE doesn't like when you run your website without HTTP server and can cause this error. Are you running any webserver or opening the HTML directly in the browser?

If running without a webserver, could you try run it in a web server.