Articles of grunt usemin

如何使用grunt-usemin来使用外部文件?

如何使用grunt-usemin下载外部文件并进行连接? <!– build:js release/all.min.js –> <script type="text/javascript" src="scripts/jquery.js"></script> <script type="text/javascript" src="scripts/jquery.carouFredSel.js"></script> <script type="text/javascript" src="http://cdn.domain.com.br/scripts/jquery.cycle.js"></script> <script type="text/javascript" src="http://cdn.domain.com.br/scripts/jquery.slideshow.js"></script> <!– endbuild –> 并useminprepare显示: concat: { generated: { files: [ { dest: '.tmp/concat/release/all.min.js', src: [ 'web/scripts/jquery.js', 'web/scripts/jquery.carouFredSel.js', 'web/http:/cdn.domain.com.br/scripts/jquery.cycle.js', 'web/http:/cdn.domain.com.br/scripts/jquery.slideshow.js'] } ] } } 最后两个文件不会添加到我的all.min.js,因为是外部文件。 如何包含?

grunt-usemin src文件是空的

我正在尝试在我的项目中使用grunt-usemin来缩小JS和CSS文件,但是效果不好。 所以我创build了一个简单的例子,如grunt-usemin文档,这也不起作用。 我有简单的结构: . ├── Gruntfile.js ├── dist │ └── js ├── index.html ├── js │ ├── bar.js │ └── foo.js └── package.json 在index.html中,我有下面的块参考2个JS文件: <!– build:js js/optimized.js –> <script src="/js/foo.js"></script> <script src="/js/bar.js"></script> <!– endbuild –> 我的Gruntfile.js: module.exports = function(grunt) { // Project configuration. grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), useminPrepare: { html: 'index.html', options: { dest: 'dist' } […]

grunt-usemin块path不相对于html文件?

在grunt-usemin的configuration和使用的各个点上,如何处理path有许多麻烦。 我有下面的回购布局,其中回购根也将是Web应用程序的根: /dashboard/index.html /Gruntfile.js /vendor/…some 3rd party CSS and JS… 所以index.html文件 – > somedomain.com/dashboard/index.html。 index.html文件包含来自/ vendor文件夹的一些CSS和JS资源。 我有咕噜configuration将生成输出到生成文件夹中: /build/dashboard/index.html 在index.html文件中,我使用了包含所有CSS链接和JS脚本标签的usemin块: <!– build:css(.) app.min.css –> <!– build:js(.) app.min.js –> 我必须用“(。)”指定一个“替代searchpath”,这样“/vendor/backbone.js”的脚本标签才能在正确的位置find它。 直到我这样做,它正在寻找/dashboard/vendor/backbone.js。 我希望处理CSS / JS资源的输出被输出到build / dashboard / app.min.css和build / dashboard / app.min.js,并且被index.html使用一个简单的相对“app.min”来包含。 css / js“path。 问题是,grunt-usemin似乎在使用我为两个上下文指定的“app.min。*”path,这使得它们无法一起工作: 1)为了创build文件而将path视为相对于构build目录; 该文件最终在build / app.min.css和build / app.min.js。 2)为了生成新的链接/脚本标签,将path视为相对于index.html文件; 浏览器加载build / dashboard / […]

如何使用我自己的选项configurationconcat和uglify与grunt-usemin

例如:我使用下面的当前configurationuglify我的Gruntfile中的JS脚本: uglify: { options: { report: "min", //"gzip", sourceMap: true, preserveComments: false, //"some", "all" }, application: { options: { // expand: true, banner: '<%= app.banner %>', preserveComments: "some" }, src: 'dist/js/application.js', dest: ".tmp/js/application.min.js" }, dependencies: { options: { sourceMap: false }, src: ['dist/js/dependencies.js'], dest: ".tmp/js/dependencies.min.js" }, 我知道,grunt-usemin从useminPrepare gruntfile选项中声明的html文件中的代码块生成src和dest选项,例如: <!– build:js js/app.js –> <script src="js/app.js"></script> <script […]

grunt-bower-install:排除某些组件

我刚刚使用angular-fullstack yeoman生成器创build了一个新的webapp。 我注意到,grunt-bower-install在<!– bower:js –>标记之间的index.html文件中生成了JS bower组件。 <!– 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/vendor/assets/javascripts/bootstrap/affix.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/alert.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/button.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/carousel.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/collapse.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/dropdown.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/tab.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/transition.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/scrollspy.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/modal.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/tooltip.js"></script> <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/popover.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> <!– endbower –> 我如何排除某些引导组件?

Grunt usemin和usemin准备多个目标

从usemin问题看来,usemin和useminPrepare支持最新版本中的多个目标: useminPrepare支持: https://github.com/yeoman/grunt-usemin/pull/162 https://github.com/yeoman/grunt-usemin/pull/206 usemin支持: https://github.com/yeoman/grunt-usemin/issues/57 我试过用以下configuration使用多个目标: useminPrepare: { foo: { dest: 'fooDist', src: ['foo/index.html'] }, bar: { dest: 'barDist', src: ['bar/index.html'] } }, usemin: { foo: { options: { assetsDirs : ['fooDist'] }, html: ['fooDist/**/*.html'], css: ['fooDist/styles/**/*.css'] }, bar: { options: { assetsDirs : ['barDist'] }, html: ['barDist/**/*.html'], css: ['barDist/styles/**/*.css'] } }, 但我收到以下错误: 运行“usemin:foo”(usemin)任务警告:不支持的模式:foo […]

除.spec.js之外的每个.js文件的节点glob模式

我正在寻找一个更好的glob模式usemin,我想find所有的.js文件,但排除.spec.js文件。 到目前为止,我有以下解决scheme。 <script src="components/**/*(.js|!(*.spec.js|*.scss))"></script> 我现在的解决scheme要求我不断添加文件扩展名来排除它们,否则会被拿起来,例如.html文件。 我试图让它只能find.js文件,并从他们排除.spec.js ,但似乎并没有工作。 另外添加!components/**/*.spec.js作为下面的另一个脚本似乎不工作。