所以我的项目有很多插件安装了bower
所有这些都在他们自己的自定义文件夹中,所有这些文件夹都包含在bower_components
文件夹
现在我希望运行一个grunt
脚本,基本上可以使用所有这些脚本并uglify
。
所以我创建了以下脚本:
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
copy: {
dist: {
files: [ {src: 'index.html', dest: 'dist/index.html'} ]
}
},
'useminPrepare': {
options: {
dest: 'dist'
},
html: 'index.html'
},
usemin: {
html: ['dist/index.html']
}
});
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-usemin');
grunt.registerTask('default', ['useminPrepare', 'copy', 'concat', 'uglify', 'usemin']);
};
取自另一个SO question
但是每当我运行此命令时,我都会收到以下警告/错误:
不" concat"找到目标。 警告:任务" concat"失败。使用--force继续。 因警告而中止。
谁能告诉我我做错了什么?
我index.html
的样子示例:
<!DOCTYPE html>
<html lang="en" data-ng-app="app" ng-controller="AppCtrl">
<head>
<script src="js/newrelic.js"></script>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<!-- remove browser caching -->
<meta http-equiv="cache-control" content="max-age=0"/>
<meta http-equiv="cache-control" content="no-cache"/>
<meta http-equiv="expires" content="0"/>
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT"/>
<meta http-equiv="pragma" content="no-cache"/>
<!-- Favicons start -->
<link rel="icon"
href="{{ app.settings.favicon ? 'user_resources/organization/' + app.settings.org_id + '/16x16-favicon.ico' : 'img/learning_bank/favicon.ico' }}"
type="image/x-icon">
<meta name="apple-mobile-web-app-capable" content="yes"/>
<!-- hide top bar in mobile safari-->
<!--<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> translucent top bar -->
<link rel="shortcut icon" href="{{ app.settings.favicon ? 'user_resources/organization/' + app.settings.org_id + '/16x16-favicon.ico' : 'img/learning_bank/favicon.ico' }}" type="image/x-icon">
<!-- For third-generation iPad with high-resolution Retina display: -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="{{ app.settings.favicon ? 'user_resources/organization/' + app.settings.org_id + '/144x144-favicon.png' : 'img/learning_bank/144x144-favicon.png' }}"/>
<!-- For iPhone with high-resolution Retina display: -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="{{ app.settings.favicon ? 'user_resources/organization/' + app.settings.org_id + '/114x114-favicon.png' : 'img/learning_bank/114x114-favicon.png' }}"/>
<!-- For first- and second-generation iPad: -->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="{{ app.settings.favicon ? 'user_resources/organization/' + app.settings.org_id + '/72x72-favicon.png' : 'img/learning_bank/72x72-favicon.png' }}"/>
<!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
<link rel="apple-touch-icon-precomposed" sizes="57x57"
href="{{ app.settings.favicon ? 'user_resources/organization/' + app.settings.org_id + '/57x57-favicon.png' : 'img/learning_bank/57x57-favicon.png' }}"/>
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" type="text/css"/>
<link rel="stylesheet" href="bower_components/animate.css/animate.css" type="text/css"/>
<link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css" type="text/css"/>
<link rel="stylesheet" href="bower_components/simple-line-icons/css/simple-line-icons.css" type="text/css"/>
<link rel="stylesheet" href="css/font.css" type="text/css"/>
<link rel="stylesheet" href="bower_components/angular-chartjs/dist/angular-chart.css">
<link rel="stylesheet" href="css/app.css" type="text/css"/>
<link rel="stylesheet" href="css/animate.css" type="text/css"/>
<link rel="stylesheet" href="css/companies.css" type="text/css"/>
<link rel="stylesheet" href="css/google-chart.css" type="text/css"/>
<link rel="stylesheet" href="css/custom/costum_button.css" type="text/css"/>
<link rel="stylesheet" href="css/custom/category.css" type="text/css"/>
<link rel="stylesheet" href="css/custom/academy.css" type="text/css"/>
<link rel="stylesheet" href="css/custom/learningbank.css" type="text/css"/>
<link rel="stylesheet" href="css/custom/utility.css" type="text/css"/>
<link rel="stylesheet" href="css/custom/custom_app.css" type="text/css"/>
<link rel="stylesheet" href="css/centered-directive.css" type="text/css"/>
<link rel="stylesheet" href="css/responsive-table.css" type="text/css"/>
<link rel="stylesheet" href="css/social-media.css" type="text/css"/>
<link rel="stylesheet" href="bower_components/ng-grid/ng-grid.min.css" type="text/css"/>
<link rel="stylesheet" href="bower_components/rickshaw/rickshaw.css" type="text/css"/>
<link rel="stylesheet" href="bower_components/angularjs-toaster/toaster.css"/>
<link rel="stylesheet" href="bower_components/video.js/dist/video-js/video-js.css">
<link rel="stylesheet" href="bower_components/farbtastic/farbtastic.css">
<link rel="stylesheet" href="bower_components/bootstrap-iconpicker/icon-fonts/font-awesome-4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" href="bower_components/alertify.js/dist/css/alertify.css" type="text/css"/>
<!--<script src="http://ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-touch.js" type="application/javascript"></script>-->
<link rel="stylesheet"
href="bower_components/bootstrap-iconpicker/icon-fonts/font-awesome-4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" href="bower_components/mediaElement/build/mediaelementplayer.css">
<link rel="stylesheet" href="bower_components/angularjs-toaster/toaster.css" type="text/css"/>
<link rel="stylesheet" href="bower_components/video.js/dist/video-js/video-js.css" type="text/css"/>
<link rel="stylesheet" href="bower_components/mediaElement/build/mediaelementplayer.css" type="text/css"/>
<link data-require="fancybox@2.1.5" data-semver="2.1.5" rel="stylesheet"
href="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.css"/>
<link rel="stylesheet" href="bower_components/c3/c3.css" type="text/css">
<link rel="stylesheet" href="bower_components/alertify/dist/css/alertify.css">
</head>
<body ng-style="{'background': 'url(' + getBackgroundImage() + ') no-repeat center center fixed', '-webkit-background-size': 'cover', '-moz-background-size': 'cover', '-o-background-size': 'cover', 'background-size': 'cover', 'min-height': '100%'}">
<toaster-container toaster-options="{'position-class': 'toast-top-right', 'close-button':true}"></toaster-container>
<div class="app" id="app" ng-class="{'app-header-fixed':app.settings.headerFixed, 'app-aside-fixed':app.settings.asideFixed, 'app-aside-folded':app.settings.asideFolded, 'app-aside-dock':app.settings.asideDock, 'app-aside-bottom':app.settings.asideBottom, 'container':app.settings.container}"
ui-view></div>
<!-- jQuery -->
<!-- Angular -->
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-filter/dist/angular-filter.js"></script>
<script src="vendor/angular-locale_da-dk.js"></script>
<script src="http://www.google.com/jsapi?ext.js"></script>
<script src="js/directives/angular-google-chart.js"></script>
<script>google.load('visualization', '1', {packages: ['orgchart']});</script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.min.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-touch/angular-touch.min.js"></script>
<script src="bower_components/ng-grid/ng-grid-2.0.14.debug.js"></script>
<script src="bower_components/angularjs-toaster/toaster.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/ngstorage/ngStorage.js"></script>
<script src="bower_components/angular-ui-utils/ui-utils.js"></script>
<script src="bower_components/bootstrap-iconpicker/bootstrap-iconpicker/js/iconset/iconset-fontawesome-4.2.0.min.js"></script>
<script src="bower_components/bootstrap-iconpicker/bootstrap-iconpicker/js/bootstrap-iconpicker.js"></script>
<script src="bower_components/farbtastic/farbtastic.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-animate.min.js"
type="application/javascript"></script>
答案 0 :(得分:1)
如果您为src属性提供数组,则Uglify可以为您连接。像这样:
uglify: {
development: {
options: {},
src: [pathToMyJavaScriptFile, pathToOtherJavaScriptFile],
dest: pathToWhereIWantTheUglifiedJSToEndUp
}
}
或者您可以使用** / * .js星球来解决它,就像this post的答案一样。
我希望这会有所帮助:)