gulp-usemin 类型错误:路径必须是字符串.收到未定义 [英] gulp-usemin TypeError: Path must be a string. Received undefined
问题描述
我正在使用 gulp-usemin 来缩小我在我的应用程序中使用的 javascript 文件,由于某种原因,gulp 没有看到我的文件之一.我的 index.html 中有这个:
<!--[如果是 IE 8]><p class="browsehappy">您使用的是<strong>过时</strong>浏览器.请<a href="http://browsehappy.com/">升级您的浏览器</a>以改善您的体验.</p><![endif]--><div><ui-view></ui-view>
<div class="footer"><div class="容器"><!-- 待办事项:在此处添加 fotter -->
<!-- build:js(.) scripts/scripts.js--><script src="bower_components/jquery/dist/jquery.min.js" type="text/javascript"></script><script src="bower_components/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script><script src="bower_components/angular/angular.min.js" type="text/javascript"></script><script src="bower_components/angular-ui-router/release/angular-ui-router.min.js" type="text/javascript"></script><script src="bower_components/angular-bootstrap/ui-bootstrap-tpls-0.14.3.min.js" type="text/javascript"></script><!-- endbuild --><!-- build:js({.tmp,app}) --><script src="scripts/app.js"></script><script src="scripts/routes.js" type="text/javascript"></script><script src="scripts/controllers/controller1.js" type="text/javascript"></script><script src="scripts/controllers/controller2.js" type="text/javascript"></script><script src="scripts/services/service1.js" type="text/javascript"></script><script src="scripts/services/service2.js" type="text/javascript"></script><script src="scripts/directives/directive1/directive1.js" type="text/javascript"></script><script src="scripts/directives/directive2/directive2.js" type="text/javascript"></script><!-- endbuild -->
这是我的 gulpfile.js:
//2015-12-16 使用 generator-angular 0.15.1 生成'使用严格';var gulp = require('gulp'),usemin = require('gulp-usemin'),wrap = require('gulp-wrap'),connect = require('gulp-connect'),watch = require('gulp-watch'),minifyCss = require('gulp-minify-css'),minifyJs = require('gulp-uglify'),concat = require('gulp-concat'),少 = 要求('少喝'),rename = require('gulp-rename'),minifyHTML = require('gulp-minify-html'),zip = require('gulp-zip');变量路径 = {脚本:'app/scripts/**/*.*',样式:'app/styles/**/*.less',custom_css: 'app/styles/**/*.css',custom_fonts: 'fonts/**/*.{ttf,woff,eof,svg}',图像:'app/images/**/*.*',模板:'app/views/**/*.html',索引:'app/index.html',bower_fonts: 'bower_components/**/*.{ttf,woff,eof,svg}',customstyle:'bower_components/bootstrap/dist/css/bootstrap.min.css'};var logerror = function(e){ console.log(e);};/*** 从索引处理凉亭组件*/gulp.task('usemin', function() {返回 gulp.src(paths.index).pipe(usemin({js: [minifyJs().on('error', function(e){ console.log(e); }), 'concat'],css: [minifyCss({keepSpecialComments: 0}), 'concat']})).pipe(gulp.dest('dist/'));});gulp.task('zip', function () {return gulp.src(['dist/**/*.*', '!dist/dist.zip', '!dist/index.html']).pipe(zip('dist.zip')).pipe(gulp.dest('dist/'));});/*** 复制资产*/gulp.task('build-assets', ['copy-bower_fonts', 'custom-less', 'custom-css']);gulp.task('copy-bower_fonts', function() {返回 gulp.src(paths.bower_fonts).pipe(重命名({目录名:'/字体'})).pipe(gulp.dest('dist/'));});gulp.task('custom-less', function() {返回 gulp.src(paths.styles).pipe(less()).pipe(gulp.dest('dist/styles'));});gulp.task('custom-css', function() {返回 gulp.src(paths.custom_css).pipe(minifyCss()).pipe(concat('custom.min.css')).pipe(gulp.dest('dist/styles'));});gulp.task('copy-templates', function() {返回 gulp.src(paths.templates).pipe(minifyHTML().on('error',logerror)).pipe(gulp.dest('dist/views'));});/*** 观看自定义文件*/gulp.task('watch', function() {gulp.watch([paths.index], ['usemin']);gulp.watch([paths.customstyle], ['usemin']);gulp.watch([ 'dist/**/*.*', '!dist/dist.zip', '!dist/index.html'], ['zip']);});/***实时重载服务器*/gulp.task('webserver', function() {连接服务器({根:'dist',实时加载:真实,端口:8888});});gulp.task('livereload', function() {gulp.src(['dist/**/*.*']).pipe(watch()).pipe(connect.reload());});/*** 吞咽任务*/gulp.task('build', ['build-assets','copy-templates', 'usemin']);gulp.task('default', ['build', 'zip']);gulp.task('run', ['build', 'webserver', 'livereload', 'watch']);
当我运行默认任务时,我收到此消息:
<块引用>类型错误:路径必须是字符串.收到未定义
如果我从索引中删除 <script src="scripts/directives/directive2/directive2.js" type="text/javascript"></script>
运行 gulp 任务没有错误,我很确定该文件在那里并且 url 写入正确.
请帮忙!!
我发现的解决方案是将 {mangle:false}
传递给 'gulp-uglify' 构造函数,在我的情况下替换
gulp.task('usemin', function() {返回 gulp.src(paths.index).pipe(usemin({js: [minifyJs({mangle:false}).on('error', function(e){ console.log(e); }), 'concat'],css: [minifyCss({keepSpecialComments: 0}), 'concat']})).pipe(gulp.dest('dist/'));});
这篇文章中的更多信息:Gulp ngmin + uglify 无法正常工作
I'm using gulp-usemin for minify the javascript files I use in my app, for some reason gulp is not seeing one of my files. I have this in my index.html:
<body ng-app="App">
<!--[if lte IE 8]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<div>
<ui-view></ui-view>
</div>
<div class="footer">
<div class="container">
<!-- TODO: add fotter here -->
</div>
</div>
<!-- build:js(.) scripts/scripts.js-->
<script src="bower_components/jquery/dist/jquery.min.js" type="text/javascript"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
<script src="bower_components/angular/angular.min.js" type="text/javascript"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.min.js" type="text/javascript"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls-0.14.3.min.js" type="text/javascript"></script>
<!-- endbuild -->
<!-- build:js({.tmp,app}) -->
<script src="scripts/app.js"></script>
<script src="scripts/routes.js" type="text/javascript"></script>
<script src="scripts/controllers/controller1.js" type="text/javascript"></script>
<script src="scripts/controllers/controller2.js" type="text/javascript"></script>
<script src="scripts/services/service1.js" type="text/javascript"></script>
<script src="scripts/services/service2.js" type="text/javascript"></script>
<script src="scripts/directives/directive1/directive1.js" type="text/javascript"></script>
<script src="scripts/directives/directive2/directive2.js" type="text/javascript"></script>
<!-- endbuild -->
</body>
And this is my gulpfile.js:
// Generated on 2015-12-16 using generator-angular 0.15.1
'use strict';
var gulp = require('gulp'),
usemin = require('gulp-usemin'),
wrap = require('gulp-wrap'),
connect = require('gulp-connect'),
watch = require('gulp-watch'),
minifyCss = require('gulp-minify-css'),
minifyJs = require('gulp-uglify'),
concat = require('gulp-concat'),
less = require('gulp-less'),
rename = require('gulp-rename'),
minifyHTML = require('gulp-minify-html'),
zip = require('gulp-zip');
var paths = {
scripts: 'app/scripts/**/*.*',
styles: 'app/styles/**/*.less',
custom_css: 'app/styles/**/*.css',
custom_fonts: 'fonts/**/*.{ttf,woff,eof,svg}',
images: 'app/images/**/*.*',
templates: 'app/views/**/*.html',
index: 'app/index.html',
bower_fonts: 'bower_components/**/*.{ttf,woff,eof,svg}',
customstyle:'bower_components/bootstrap/dist/css/bootstrap.min.css'
};
var logerror = function(e){ console.log(e); };
/**
* Handle bower components from index
*/
gulp.task('usemin', function() {
return gulp.src(paths.index)
.pipe(usemin({
js: [minifyJs().on('error', function(e){ console.log(e); }), 'concat'],
css: [minifyCss({keepSpecialComments: 0}), 'concat']
}))
.pipe(gulp.dest('dist/'));
});
gulp.task('zip', function () {
return gulp.src(['dist/**/*.*', '!dist/dist.zip', '!dist/index.html'])
.pipe(zip('dist.zip'))
.pipe(gulp.dest('dist/'));
});
/**
* Copy assets
*/
gulp.task('build-assets', ['copy-bower_fonts', 'custom-less', 'custom- css']);
gulp.task('copy-bower_fonts', function() {
return gulp.src(paths.bower_fonts)
.pipe(rename({
dirname: '/fonts'
}))
.pipe(gulp.dest('dist/'));
});
gulp.task('custom-less', function() {
return gulp.src(paths.styles)
.pipe(less())
.pipe(gulp.dest('dist/styles'));
});
gulp.task('custom-css', function() {
return gulp.src(paths.custom_css)
.pipe(minifyCss())
.pipe(concat('custom.min.css'))
.pipe(gulp.dest('dist/styles'));
});
gulp.task('copy-templates', function() {
return gulp.src(paths.templates)
.pipe(minifyHTML().on('error',logerror))
.pipe(gulp.dest('dist/views'));
});
/**
* Watch custom files
*/
gulp.task('watch', function() {
gulp.watch([paths.index], ['usemin']);
gulp.watch([paths.customstyle], ['usemin']);
gulp.watch([ 'dist/**/*.*', '!dist/dist.zip', '!dist/index.html'], ['zip']);
});
/**
* Live reload server
*/
gulp.task('webserver', function() {
connect.server({
root: 'dist',
livereload: true,
port: 8888
});
});
gulp.task('livereload', function() {
gulp.src(['dist/**/*.*'])
.pipe(watch())
.pipe(connect.reload());
});
/**
* Gulp tasks
*/
gulp.task('build', ['build-assets','copy-templates', 'usemin']);
gulp.task('default', ['build', 'zip']);
gulp.task('run', ['build', 'webserver', 'livereload', 'watch']);
When I run default task I get this message:
TypeError: Path must be a string. Received undefined
If I remove <script src="scripts/directives/directive2/directive2.js" type="text/javascript"></script>
from the index the gulp task run without errors and I'm pretty sure the file is there and url is written correctly.
Please help!!
The solution I found is passing {mangle:false}
to 'gulp-uglify' constructor, in my case replace
gulp.task('usemin', function() {
return gulp.src(paths.index)
.pipe(usemin({
js: [minifyJs({mangle:false}).on('error', function(e){ console.log(e); }), 'concat'],
css: [minifyCss({keepSpecialComments: 0}), 'concat']
}))
.pipe(gulp.dest('dist/'));
});
More information in this post: Gulp ngmin + uglify not working properly
这篇关于gulp-usemin 类型错误:路径必须是字符串.收到未定义的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!