angularjs - removes few js reference during build -
i got yo template angular modify add additional js references suit requirement. noticed "<script src="bower_components/flexslider/jquery.flexslider.js"></script>" removed index.html file when build it. wasn't suppose inside <!-- bower.js --> tag? why getting removed during build?
same main.scss, @import "bower_components/font-awesome-sass/assets/stylesheets/font-awesome.scss"; removed during build.
main.scss
$icon-font-path: "../bower_components/bootstrap-sass-official/assets/fonts/bootstrap/"; $fa-font-path: "../bower_components/font-awesome-sass/assets/fonts/font-awesome/"; // bower:scss @import "bower_components/font-awesome-sass/assets/stylesheets/font-awesome.scss"; @import "bootstrap-sass-official/assets/stylesheets/_bootstrap.scss"; // endbower .browsehappy { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } body { padding: 0; } index.html
<!doctype html> <html class="no-js" ng-app="mainapp"> <head> <meta charset="utf-8"> <title>blancboard</title> <meta name="description" content=""> <meta name="viewport" content="width=device-width"> <!-- place favicon.ico , apple-touch-icon.png in root directory --> <link rel="shortcut icon" href="favicon.ico"> <!-- build:css(.) styles/vendor.css --> <!-- bower:css --> <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" /> <!-- endbower --> <!-- endbuild --> <!-- build:css(.tmp) styles/main.css --> <link rel="stylesheet" href="styles/main.css"> <link rel="stylesheet" href="styles/styles.css"> <!-- endbuild --> <!-- html5 shim , respond.js ie8 support of html5 elements , media queries --> <!--[if lt ie 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]--> </head> <body class="home-page"> <!--[if lt ie 7]> <p class="browsehappy">you using <strong>outdated</strong> browser. please <a href="http://browsehappy.com/">upgrade browser</a> improve experience.</p> <![endif]--> <!-- add site or application content here --> <div ui-view="header"></div> <div ui-view="content"></div> <div ui-view="footer"></div> <!-- google analytics: change ua-xxxxx-x site's id --> <script> !function(a,n,g,u,l,a,r){a.googleanalyticsobject=l,a[l]=a[l]||function(){ (a[l].q=a[l].q||[]).push(arguments)},a[l].l=+new date,a=n.createelement(g), r=n.getelementsbytagname(g)[0],a.src=u,r.parentnode.insertbefore(a,r) }(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'ua-xxxxx-x'); ga('send', 'pageview'); </script> <!-- build:js(.) scripts/vendor.js --> <!-- bower:js --> <script src="bower_components/jquery/dist/jquery.js"></script> <script src="bower_components/angular/angular.js"></script> <script src="bower_components/bootstrap-sass-official/assets/javascripts/bootstrap.js"></script> <script src="bower_components/angular-animate/angular-animate.js"></script> <script src="bower_components/angular-cookies/angular-cookies.js"></script> <script src="bower_components/angular-resource/angular-resource.js"></script> <script src="bower_components/angular-route/angular-route.js"></script> <script src="bower_components/angular-sanitize/angular-sanitize.js"></script> <script src="bower_components/angular-touch/angular-touch.js"></script> <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script> <script src="bower_components/jquery-placeholder/jquery.placeholder.js"></script> <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script> <script src="bower_components/bootstrap-hover-dropdown/bootstrap-hover-dropdown.js"></script> <script src="bower_components/jquery-migrate/jquery-migrate.js"></script> <script src="bower_components/fitvids/jquery.fitvids.js"></script> <script src="bower_components/flexslider/jquery.flexslider.js"></script> <!-- endbower --> <!-- endbuild --> <!-- build:js({.tmp,app}) scripts/scripts.js --> <script src="scripts/app.js"></script> <script src="scripts/controllers/home.js"></script> <script src="scripts/controllers/about.js"></script> <script src="scripts/controllers/pricing.js"></script> <script src="scripts/template/body.js"></script> <!-- endbuild --> </body> </html> bower.jason
{ "name": "yo", "version": "0.0.0", "dependencies": { "angular": "^1.3.0", "bootstrap-sass-official": "^3.2.0", "angular-animate": "^1.3.0", "angular-cookies": "^1.3.0", "angular-resource": "^1.3.0", "angular-route": "^1.3.0", "angular-sanitize": "^1.3.0", "angular-touch": "^1.3.0", "angular-ui-router": "~0.2.13", "font-awesome-sass": "~4.3.1", "jquery-placeholder": "~2.1.1", "bootstrap-hover-dropdown": "~2.1.3", "jquery-migrate": "~1.2.1", "fitvids": "~1.1.0", "flexslider": "~2.4.0" }, "devdependencies": { "angular-mocks": "^1.3.0" }, "apppath": "app", "modulename": "mainapp" } gruntfile.js
// generated on 2015-04-09 using generator-angular 0.11.1 'use strict'; // # globbing // performance reasons we're matching 1 level down: // 'test/spec/{,*/}*.js' // use if want recursively match subfolders: // 'test/spec/**/*.js' module.exports = function (grunt) { // load grunt tasks automatically require('load-grunt-tasks')(grunt); // time how long tasks take. can when optimizing build times require('time-grunt')(grunt); // configurable paths application var appconfig = { app: require('./bower.json').apppath || 'app', dist: 'dist' }; // define configuration tasks grunt.initconfig({ // project settings yeoman: appconfig, // watches files changes , runs tasks based on changed files watch: { bower: { files: ['bower.json'], tasks: ['wiredep'] }, js: { files: ['<%= yeoman.app %>/scripts/{,*/}*.js'], tasks: ['newer:jshint:all'], options: { livereload: '<%= connect.options.livereload %>' } }, jstest: { files: ['test/spec/{,*/}*.js'], tasks: ['newer:jshint:test', 'karma'] }, compass: { files: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'], tasks: ['compass:server', 'autoprefixer'] }, less: { files: ['<%= yeoman.app %>/styles/less/**/*.less'], tasks: ['less:server', 'autoprefixer'] }, gruntfile: { files: ['gruntfile.js'] }, livereload: { options: { livereload: '<%= connect.options.livereload %>' }, files: [ '<%= yeoman.app %>/**/*.html', '.tmp/styles/{,*/}*.css', '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}' ] } }, // actual grunt server settings connect: { // proxy requests starting /whieboard-rest server on port 8080 proxies: [ { context: '/whiteboard-rest', host: 'localhost', port: 8080, https: false, changeorigin: false } ], options: { port: 9000, // change '0.0.0.0' access server outside. hostname: 'localhost', livereload: 35729 }, livereload: { options: { open: true, middleware: function (connect) { return [ connect.static('.tmp'), connect().use( '/bower_components', connect.static('./bower_components') ), connect().use( '/app/styles', connect.static('./app/styles') ), connect.static(appconfig.app) ]; } } }, test: { options: { port: 9001, middleware: function (connect) { return [ connect.static('.tmp'), connect.static('test'), connect().use( '/bower_components', connect.static('./bower_components') ), connect.static(appconfig.app) ]; } } }, dist: { options: { open: true, base: '<%= yeoman.dist %>' } } }, // make sure code styles par , there no obvious mistakes jshint: { options: { jshintrc: '.jshintrc', reporter: require('jshint-stylish') }, all: { src: [ 'gruntfile.js', '<%= yeoman.app %>/scripts/{,*/}*.js' ] }, test: { options: { jshintrc: 'test/.jshintrc' }, src: ['test/spec/{,*/}*.js'] } }, // empties folders start fresh clean: { dist: { files: [{ dot: true, src: [ '.tmp', '<%= yeoman.dist %>/{,*/}*', '!<%= yeoman.dist %>/.git{,*/}*' ] }] }, server: '.tmp' }, // add vendor prefixed styles autoprefixer: { options: { browsers: ['last 1 version'] }, server: { options: { map: true, }, files: [{ expand: true, cwd: '.tmp/styles/', src: '{,*/}*.css', dest: '.tmp/styles/' }] }, dist: { files: [{ expand: true, cwd: '.tmp/styles/', src: '{,*/}*.css', dest: '.tmp/styles/' }] } }, // automatically inject bower components app wiredep: { app: { src: ['<%= yeoman.app %>/index.html'], ignorepath: /\.\.\// }, test: { devdependencies: true, src: '<%= karma.unit.configfile %>', ignorepath: /\.\.\//, filetypes:{ js: { block: /(([\s\t]*)\/{2}\s*?bower:\s*?(\s*))(\n|\r|.)*?(\/{2}\s*endbower)/gi, detect: { js: /'(.*\.js)'/gi }, replace: { js: '\'{{filepath}}\',' } } } }, sass: { src: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'], ignorepath: /(\.\.\/){1,2}bower_components\// } }, // compiles sass css , generates necessary files if requested compass: { options: { sassdir: '<%= yeoman.app %>/styles', cssdir: '.tmp/styles', generatedimagesdir: '.tmp/images/generated', imagesdir: '<%= yeoman.app %>/images', javascriptsdir: '<%= yeoman.app %>/scripts', fontsdir: '<%= yeoman.app %>/styles/fonts', importpath: './bower_components', httpimagespath: '/images', httpgeneratedimagespath: '/images/generated', httpfontspath: '/styles/fonts', relativeassets: false, assetcachebuster: false, raw: 'sass::script::number.precision = 10\n' }, dist: { options: { generatedimagesdir: '<%= yeoman.dist %>/images/generated' } }, server: { options: { sourcemap: true } } }, // compiles less css , generates necessary files if requested less: { options: { compress: true, path: '<%= yeoman.app %>/styles/*', optimization: 2 }, dist: { files: { // target.css file: source.less file '.tmp/styles/styles.css': '<%= yeoman.app %>/styles/less/default/styles.less' } }, server: { files: { // target.css file: source.less file '.tmp/styles/styles.css': '<%= yeoman.app %>/styles/less/default/styles.less' } } }, // renames files browser caching purposes filerev: { dist: { src: [ '<%= yeoman.dist %>/scripts/{,*/}*.js', '<%= yeoman.dist %>/styles/{,*/}*.css', '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}', '<%= yeoman.dist %>/styles/fonts/*' ] } }, // reads html usemin blocks enable smart builds automatically // concat, minify , revision files. creates configurations in memory // additional tasks can operate on them useminprepare: { html: '<%= yeoman.app %>/index.html', options: { dest: '<%= yeoman.dist %>', flow: { html: { steps: { js: ['concat', 'uglifyjs'], css: ['cssmin'] }, post: {} } } } }, // performs rewrites based on filerev , useminprepare configuration usemin: { html: ['<%= yeoman.dist %>/**/*.html'], css: ['<%= yeoman.dist %>/styles/{,*/}*.css'], options: { assetsdirs: [ '<%= yeoman.dist %>', '<%= yeoman.dist %>/images', '<%= yeoman.dist %>/styles' ] } }, // following *-min tasks produce minified files in dist folder // default, `index.html`'s <!-- usemin block --> take care of // minification. these next options pre-configured if not wish // use usemin blocks. cssmin: { dist: { files: { '<%= yeoman.dist %>/styles/main.css': [ '.tmp/styles/{,*/}*.css' ] } } }, // uglify: { // dist: { // files: { // '<%= yeoman.dist %>/scripts/scripts.js': [ // '<%= yeoman.dist %>/scripts/scripts.js' // ] // } // } // }, // concat: { // dist: {} // }, imagemin: { dist: { files: [{ expand: true, cwd: '<%= yeoman.app %>/images', src: '{,*/}*.{png,jpg,jpeg,gif}', dest: '<%= yeoman.dist %>/images' }] } }, svgmin: { dist: { files: [{ expand: true, cwd: '<%= yeoman.app %>/images', src: '{,*/}*.svg', dest: '<%= yeoman.dist %>/images' }] } }, htmlmin: { dist: { options: { collapsewhitespace: true, conservativecollapse: true, collapsebooleanattributes: true, removecommentsfromcdata: true, removeoptionaltags: true }, files: [{ expand: true, cwd: '<%= yeoman.dist %>', src: ['*.html', 'pages/**/*.html'], dest: '<%= yeoman.dist %>' }] } }, // ng-annotate tries make code safe minification automatically // using angular long form dependency injection. ngannotate: { dist: { files: [{ expand: true, cwd: '.tmp/concat/scripts', src: '*.js', dest: '.tmp/concat/scripts' }] } }, // replace google cdn references cdnify: { dist: { html: ['<%= yeoman.dist %>/*.html'] } }, // copies remaining files places other tasks can use copy: { dist: { files: [{ expand: true, dot: true, cwd: '<%= yeoman.app %>', dest: '<%= yeoman.dist %>', src: [ '*.{ico,png,txt}', '.htaccess', '*.html', 'pages/**/*.html', 'images/{,*/}*.{webp}', 'styles/fonts/{,*/}*.*' ] }, { expand: true, cwd: '.tmp/images', dest: '<%= yeoman.dist %>/images', src: ['generated/*'] }, { expand: true, cwd: '.', src: 'bower_components/bootstrap-sass-official/assets/fonts/bootstrap/*', dest: '<%= yeoman.dist %>' }] }, styles: { expand: true, cwd: '<%= yeoman.app %>/styles', dest: '.tmp/styles/', src: '{,*/}*.css' } }, // run tasks in parallel speed build process concurrent: { server: [ 'compass:server', 'less:server' ], test: [ 'compass', 'less' ], dist: [ 'compass:dist', 'less:dist', 'imagemin', 'svgmin' ] }, // test settings karma: { unit: { configfile: 'test/karma.conf.js', singlerun: true } } }); grunt.registertask('serve', 'compile start connect web server', function (target) { if (target === 'dist') { return grunt.task.run(['build', 'connect:dist:keepalive']); } grunt.task.run([ 'clean:server', 'wiredep', 'configureproxies', 'concurrent:server', 'autoprefixer:server', 'connect:livereload', 'watch' ]); }); grunt.registertask('server', 'deprecated task. use "serve" task instead', function (target) { grunt.log.warn('the `server` task has been deprecated. use `grunt serve` start server.'); grunt.task.run(['serve:' + target]); }); grunt.registertask('test', [ 'clean:server', 'wiredep', 'concurrent:test', 'autoprefixer', 'connect:test', 'karma' ]); grunt.registertask('build', [ 'clean:dist', 'wiredep', 'useminprepare', 'concurrent:dist', 'autoprefixer', 'concat', 'ngannotate', 'copy:dist', //commenting cdnify not workig //'cdnify', 'cssmin', 'uglify', 'filerev', 'usemin', 'htmlmin' ]); grunt.registertask('default', [ 'newer:jshint', 'test', 'build' ]); };
it issue flexslider's bower.json file. doesn't have main in bower.json file have added override below fixed issue
"overrides": { "flexslider": { "main": "./jquery.flexslider.js" } }, reference: https://github.com/taptapship/wiredep/#bower-overrides
Comments
Post a Comment