0

My angular application ran successfully when i used command "grunt serve". But when i built the application by using command "grunt build" The functionality is preserved but the AngularJS breaks.

After a lot of searching and trying different solutions i was convinced that this is the problem of minification. So, I tried the solution provided by many developers on stackoverflow. i.e. to include the following code in my Gruntfile.js

uglify: {
        options: {
            report: 'min',
            mangle: false
        }
    }

After doing that also my angular is still not in place.

Request someone to find the error/ problem I am facing. Would appreciate your inputs.

My registered task for built and default are:

  grunt.registerTask('build', [
    'clean:dist',
    'wiredep',
    'copy',
    'useminPrepare',
    'concurrent:dist',
    'autoprefixer',
    'concat',
    'uglify',
    'copy:dist',
    'cdnify',
    'cssmin',
    'rev',
    'ngmin',    
    'filerev',
    'usemin',
    'htmlmin'
  ]);

  grunt.registerTask('default', [
    'copy', 'useminPrepare', 'concat', 'uglify', 'cssmin', 'rev', 'usemin',
    'newer:jshint',
    'test',
    'build'
  ]);

After execution of the grunt build --force command I get the following Output (Request you to read it if you feel the need since its pretty long ).

Loading "imagemin.js" tasks...[31mERROR[39m
[31m>> [39mError: Cannot find module 'imagemin-optipng'

[4mRunning "clean:dist" (clean) task[24m
Cleaning .tmp...[32mOK[39m
Cleaning dist/.htaccess...[32mOK[39m
Cleaning dist/404.html...[32mOK[39m
Cleaning dist/favicon.ico...[32mOK[39m
Cleaning dist/fonts...[32mOK[39m
Cleaning dist/index.html...[32mOK[39m
Cleaning dist/robots.txt...[32mOK[39m
Cleaning dist/scripts...[32mOK[39m
Cleaning dist/styles...[32mOK[39m
Cleaning dist/views...[32mOK[39m

[4mRunning "wiredep:app" (wiredep) task[24m

[4mRunning "copy:dist" (copy) task[24m
Created [36m1[39m directories, copied [36m18[39m files

[4mRunning "copy:styles" (copy) task[24m
Copied [36m2[39m files

[4mRunning "useminPrepare:html" (useminPrepare) task[24m
Going through [36mapp/index.html[39m to update the config
Looking for build script HTML comment blocks

[1mConfiguration is now:[22m

[1m  concat:[22m
  { dist: {},
  generated: 
   { files: 
      [ { dest: [32m'.tmp\\concat\\scripts\\oldieshim.js'[39m,
          src: 
           [ [32m'bower_components\\es5-shim\\es5-shim.js'[39m,
             [32m'bower_components\\json3\\lib\\json3.min.js'[39m ] },
        { dest: [32m'.tmp\\concat\\scripts\\vendor.js'[39m,
          src: 
           [ [32m'bower_components\\jquery\\dist\\jquery.js'[39m,
             [32m'bower_components\\angular\\angular.js'[39m,
             [32m'bower_components\\json3\\lib\\json3.js'[39m,
             [32m'bower_components\\bootstrap\\dist\\js\\bootstrap.js'[39m,
             [32m'bower_components\\angular-resource\\angular-resource.js'[39m,
             [32m'bower_components\\angular-cookies\\angular-cookies.js'[39m,
             [32m'bower_components\\angular-sanitize\\angular-sanitize.js'[39m,
             [32m'bower_components\\angular-animate\\angular-animate.js'[39m,
             [32m'bower_components\\angular-touch\\angular-touch.js'[39m,
             [32m'bower_components\\angular-route\\angular-route.js'[39m,
             [32m'bower_components\\firebase\\firebase.js'[39m,
             [32m'bower_components\\firebase-simple-login\\firebase-simple-login.js'[39m,
             [32m'bower_components\\angularfire\\dist\\angularfire.min.js'[39m ] },
        { dest: [32m'.tmp\\concat\\scripts\\scripts.js'[39m,
          src: 
           [ [32m'{.tmp,app}\\scripts\\app.js'[39m,
             [32m'{.tmp,app}\\scripts\\controllers\\posts.js'[39m,
             [32m'{.tmp,app}\\scripts\\controllers\\dishes.js'[39m,
             [32m'{.tmp,app}\\scripts\\controllers\\details.js'[39m,
             [32m'{.tmp,app}\\scripts\\controllers\\postview.js'[39m,
             [32m'{.tmp,app}\\scripts\\controllers\\nav.js'[39m,
             [32m'{.tmp,app}\\scripts\\controllers\\auth.js'[39m,
             [32m'{.tmp,app}\\scripts\\controllers\\profile.js'[39m,
             [32m'{.tmp,app}\\scripts\\services\\auth.js'[39m,
             [32m'{.tmp,app}\\scripts\\services\\user.js'[39m,
             [32m'{.tmp,app}\\scripts\\services\\post.js'[39m,
             [32m'{.tmp,app}\\scripts\\services\\dish.js'[39m,
             [32m'{.tmp,app}\\scripts\\services\\profile.js'[39m,
             [32m'{.tmp,app}\\scripts\\filters\\url.js'[39m,
             [32m'{.tmp,app}\\scripts\\directives\\checkusername.js'[39m,
             [32m'{.tmp,app}\\scripts\\lib\\qrcode.js'[39m ] } ] } }

[1m  uglify:[22m
  { options: { report: [32m'min'[39m, mangle: [33mfalse[39m },
  generated: 
   { files: 
      [ { dest: [32m'dist\\scripts\\oldieshim.js'[39m,
          src: [ [32m'.tmp\\concat\\scripts\\oldieshim.js'[39m ] },
        { dest: [32m'dist\\scripts\\vendor.js'[39m,
          src: [ [32m'.tmp\\concat\\scripts\\vendor.js'[39m ] },
        { dest: [32m'dist\\scripts\\scripts.js'[39m,
          src: [ [32m'.tmp\\concat\\scripts\\scripts.js'[39m ] } ] } }

[1m  cssmin:[22m
  { dist: { files: { [32m'<%= yeoman.dist %>/styles/main.css'[39m: [ [32m'.tmp/styles/{,*/}*.css'[39m ] } },
  generated: 
   { files: 
      [ { dest: [32m'dist\\styles\\vendor.css'[39m,
          src: [ [32m'bower_components\\bootstrap\\dist\\css\\bootstrap.css'[39m ] },
        { dest: [32m'dist\\styles\\main.css'[39m,
          src: [ [32m'.tmp\\styles\\main.css'[39m ] } ] } }

[4mRunning "concurrent:dist" (concurrent) task[24m
[32m>> [39mWarning: There are more tasks than your concurrency limit. After this limit[32m
>> [39mis reached no further tasks will be run until the current tasks are[32m
>> [39mcompleted. You can adjust the limit in the concurrent task options

Loading "imagemin.js" tasks...[31mERROR[39m
[31m>> [39mError: Cannot find module 'imagemin-optipng'
[33mWarning: Task "imagemin" not found. [4mUsed --force, continuing.[24m[39m

[31mDone, but with warnings.[39m

Loading "imagemin.js" tasks...[31mERROR[39m
[31m>> [39mError: Cannot find module 'imagemin-optipng'

[4mRunning "copy:styles" (copy) task[24m
Copied [36m2[39m files

[32mDone, without errors.[39m

Loading "imagemin.js" tasks...[31mERROR[39m
[31m>> [39mError: Cannot find module 'imagemin-optipng'

[4mRunning "svgmin:dist" (svgmin) task[24m
Total saved: 0 B

[32mDone, without errors.[39m

[4mRunning "autoprefixer:dist" (autoprefixer) task[24m
File .tmp/styles/main.css created.
File .tmp/styles/style.css created.

[4mRunning "concat:dist" (concat) task[24m

[4mRunning "concat:generated" (concat) task[24m
File .tmp\concat\scripts\oldieshim.js created.
File .tmp\concat\scripts\vendor.js created.
File .tmp\concat\scripts\scripts.js created.

[4mRunning "uglify:generated" (uglify) task[24m
File dist\scripts\oldieshim.js created: 59.08 kB → 26.67 kB
File dist\scripts\vendor.js created: 1.45 MB → 584.31 kB
File dist\scripts\scripts.js created: 78.09 kB → 47.11 kB

[4mRunning "copy:dist" (copy) task[24m
Created [36m1[39m directories, copied [36m18[39m files

[4mRunning "cdnify:dist" (cdnify) task[24m
Going through  to update script refs

[4mRunning "cssmin:dist" (cssmin) task[24m
File dist/styles/main.css created: 6.62 kB → 4.79 kB

[4mRunning "cssmin:generated" (cssmin) task[24m
File dist\styles\vendor.css created: 132.55 kB → 108.6 kB
File dist\styles\main.css created: 937 B → 692 B
[31m>> [39mNo "rev" targets found.
[33mWarning: Task "rev" failed. [4mUsed --force, continuing.[24m[39m

[4mRunning "ngmin:dist" (ngmin) task[24m
ngminifying [36m.tmp/concat/scripts/oldieshim.js[39m, [36m.tmp/concat/scripts/scripts.js[39m, [36m.tmp/concat/scripts/vendor.js[39m

[4mRunning "filerev:dist" (filerev) task[24m
Γ£ö dist/scripts/oldieshim.js changed to oldieshim.f3b80d74.js
Γ£ö dist/scripts/scripts.js changed to scripts.cb35dbb5.js
Γ£ö dist/scripts/vendor.js changed to vendor.4e3a4803.js
Γ£ö dist/styles/main.css changed to main.91169d36.css
Γ£ö dist/styles/vendor.css changed to vendor.20833e0b.css

[4mRunning "usemin:html" (usemin) task[24m

[1mProcessing as HTML - dist/404.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/index.html[22m
Update the HTML to reference our concat/min/revved script files
<script src="scripts/oldieshim.js" changed to <script src="scripts/oldieshim.f3b80d74.js"
<script src="scripts/vendor.js" changed to <script src="scripts/vendor.4e3a4803.js"
<script src="scripts/scripts.js" changed to <script src="scripts/scripts.cb35dbb5.js"
Update the HTML with the new css filenames
<link rel="stylesheet" href="styles/vendor.css" changed to <link rel="stylesheet" href="styles/vendor.20833e0b.css"
<link rel="stylesheet" href="styles/main.css" changed to <link rel="stylesheet" href="styles/main.91169d36.css"
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/about.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/addEntry.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/details.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/dish-category.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/login.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/menu.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/nav.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/posts.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/profile-general.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/profile-tables.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/profile.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/register.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[1mProcessing as HTML - dist/views/showpost.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with the new video filenames
Update the HTML with the new poster filenames
Update the HTML with the new source filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
Update the HTML with the new img filenames in meta tags

[4mRunning "usemin:css" (usemin) task[24m

[1mProcessing as CSS - dist/styles/main.91169d36.css[22m
Update the CSS to reference our revved images

[1mProcessing as CSS - dist/styles/vendor.20833e0b.css[22m
Update the CSS to reference our revved images

[4mRunning "htmlmin:dist" (htmlmin) task[24m
Minified dist/404.html 3.53 kB → 3.39 kB
Minified dist/index.html 2.08 kB → 1.96 kB
Minified dist/views/about.html 31 B → 30 B
Minified dist/views/addEntry.html 4.26 kB → 3.54 kB
Minified dist/views/details.html 684 B → 600 B
Minified dist/views/dish-category.html 734 B → 615 B
Minified dist/views/login.html 424 B → 383 B
Minified dist/views/menu.html 1.81 kB → 1.4 kB
Minified dist/views/nav.html 1.58 kB → 1.35 kB
Minified dist/views/posts.html 1.05 kB → 863 B
Minified dist/views/profile-general.html 2.8 kB → 2.32 kB
Minified dist/views/profile-tables.html 1.69 kB → 1.53 kB
Minified dist/views/profile.html 1.64 kB → 1.36 kB
Minified dist/views/register.html 834 B → 774 B
Minified dist/views/showpost.html 1.93 kB → 1.66 kB

[31mDone, but with warnings.[39m
Div Sehgal
  • 73
  • 1
  • 1
  • 12
  • 1
    What do you mean by Angular breaks? Are you seeing an error somewhere in the console? Does Angular not load? Is some specific functionality missing? – Matthew Green Dec 01 '14 at 15:36
  • Angular Does not load.All the fancy css is missing.I am able to navigate on the UI. i.e use login/logout feature through my backend. And the model is loading the data on the pages. – Div Sehgal Dec 01 '14 at 15:40
  • 1
    Angular doesn't have any CSS. I'm assuming that the CSS that isn't working must be related to Bootstrap. Is that correct? – Matthew Green Dec 01 '14 at 15:43
  • The CSS i am using in the form are the ones which are not related to Bootstrap. But i do see a bootstrap folder in the bower_components. Is there any where else i can check from? – Div Sehgal Dec 01 '14 at 15:49
  • Also,In my Gruntfile.js, i see bootstrap which is under copy: dist: files:[{...}, { expand: true, cwd: 'bower_components/bootstrap/dist', src: 'fonts', dest: '<%= yeoman.dist %>' }] }, – Div Sehgal Dec 01 '14 at 15:56

1 Answers1

0

There was a problem in CSS and angular was running just fine.

In the app folder, delete the main.css file. I had the same issue. On build it reads in the main.css file and never gets to main.scss, so if you delete main.css, it finishes correctly via- https://github.com/yeoman/yeoman/issues/411

Div Sehgal
  • 73
  • 1
  • 1
  • 12