找不到具有临时文件的单一 glob 的文件
File not found with singular glob for a temp file
我是 Gulp 系统的新手,我正在尝试启动我的 AngularJS 应用程序并 运行。使用 Yeoman,我获得了一组标准的 gulp 任务,但其中一个任务失败并显示错误消息。我已将其缩小到特定行,但我对这个系统的了解还不够多,无法知道出现故障的原因或原因(当然,除了丢失文件的名称)。
失败的 gulp 文件如下:
const gulp = require('gulp');
const filter = require('gulp-filter');
const useref = require('gulp-useref');
const lazypipe = require('lazypipe');
const rev = require('gulp-rev');
const revReplace = require('gulp-rev-replace');
const uglify = require('gulp-uglify');
const cssnano = require('gulp-cssnano');
const htmlmin = require('gulp-htmlmin');
const sourcemaps = require('gulp-sourcemaps');
const uglifySaveLicense = require('uglify-save-license');
const ngAnnotate = require('gulp-ng-annotate');
const conf = require('../conf/gulp.conf');
gulp.task('build', build);
function build() {
const htmlFilter = filter(conf.path.tmp('*.html'), {restore: true});
const jsFilter = filter(conf.path.tmp('**/*.js'), {restore: true});
const cssFilter = filter(conf.path.tmp('**/*.css'), {restore: true});
return gulp.src(conf.path.tmp('/index.html'))
.pipe(useref({}, lazypipe().pipe(sourcemaps.init, {loadMaps: true})))
// .pipe(jsFilter)
// .pipe(ngAnnotate())
// .pipe(uglify({preserveComments: uglifySaveLicense})).on('error', conf.errorHandler('Uglify'))
// .pipe(rev())
// .pipe(jsFilter.restore)
// .pipe(cssFilter)
// .pipe(cssnano())
// .pipe(rev())
// .pipe(cssFilter.restore)
// .pipe(revReplace())
// .pipe(sourcemaps.write('maps'))
// .pipe(htmlFilter)
// .pipe(htmlmin())
// .pipe(htmlFilter.restore)
// .pipe(gulp.dest(conf.path.dist()));
}
如您所见,我已经注释掉了除违规行以外的所有内容。该行在构建过程中被调用时会产生以下错误消息:
[17:22:27] 'build' errored after 42 ms
[17:22:27] Error: Error: File not found with singular glob: C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\.tmp\jspm_packages\system.js
at DestroyableTransform.<anonymous> (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\gulp-useref\index.js:65:28)
at emitOne (events.js:101:20)
at DestroyableTransform.emit (events.js:188:7)
at emitOne (events.js:101:20)
at Through2.emit (events.js:188:7)
at OrderedStreams.<anonymous> (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\glob-stream\index.js:140:20)
at emitOne (events.js:96:13)
at OrderedStreams.emit (events.js:188:7)
at emitOne (events.js:96:13)
at DestroyableTransform.emit (events.js:188:7)
at Glob.<anonymous> (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\glob-stream\index.js:40:16)
at Glob.g (events.js:286:16)
at emitOne (events.js:96:13)
at Glob.emit (events.js:188:7)
at Glob._finish (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\glob-stream\node_modules\glob\glob.js:172:8)
at done (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\glob-stream\node_modules\glob\glob.js:159:12)
[17:22:27] 'build' errored after 25 s
[17:22:27] 'default' errored after 25 s
[17:22:27] 'serve:dist' errored after 25 s
Process finished with exit code 1
显然,它正在 jspm 包的临时副本中寻找 system.js,但是 为什么? 为什么找不到它?该文件应该在那里吗?我不知道 gulp 脚本试图做什么,所以我不能冒险猜测它为什么不起作用。
我知道这可能不足以提供全面的答案,但我希望这里有足够的信息让您至少为我指明正确的方向。
谢谢!
2017 年 1 月 3 日更新
我有点明白 userref 应该做什么。我的 index.html 文件是
<!doctype html>
<html>
<head>
<base href="/">
<meta charset="utf-8">
<title>FountainJS</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="http://fountainjs.io/assets/imgs/fountain.png" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="css/camera.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
<!-- build:css(.tmp) index.css -->
<link rel="stylesheet" href="index.css"></link>
<!-- endbuild -->
</head>
<body class="front" ng-app="app">
<div id="main">
<ui-view></ui-view>
<page-footer></page-footer>
</div>
</body>
<!-- build:js(.tmp) index.js -->
<script src="jspm_packages/system.js"></script>
<script src="jspm.browser.js"></script>
<script src="jspm.config.js"></script>
<script>
System.import('src/index.ts');
</script>
<!-- endbuild -->
</html>
我认为应该发生的是它应该替换块:
<!-- build:js(.tmp) index.js -->
<script src="jspm_packages/system.js"></script>
<script src="jspm.browser.js"></script>
<script src="jspm.config.js"></script>
<script>
System.import('src/index.ts');
</script>
<!-- endbuild -->
和
<script src="tmp/index.js"></script>
这听起来正确吗?
我实际上找到了解决方案,但一点也不明显。据我所知,Gulp 的问题之一是,通过将所有内容分解为小的专有部分,很难看到全局。这意味着我需要深入研究才能发现问题所在。
在 userref 阶段 之前发生了错误。它是在管道执行 <index.html>.pipe(replace(<pattern-describing-the-existing-javascript-includes>, '<script src="index.js">')
.
时发生的
我不记得 Yeoman 种子项目附带的确切正则表达式,但它对行应该如何终止存在偏见。正则表达式类似于:
/line1stuff\nline2stuff/
我花了很多调试时间才追踪到这一点,但我注意到正则表达式在正则表达式中工作,但当我进行实际替换时,没有任何内容被替换。
凭直觉,我尝试将正则表达式更改为:
/line1stuff[\n\r]+line2stuff/
这就解决了问题! (或者至少这个 特殊的 问题;我遇到了后续问题。)
伙计,这东西一点都不明显。我基本上不得不用 console.info
、console.warn
和 console.error
调用来填充我所有的 gulp 脚本,以跟踪我找到有问题的代码段的方式。
无论如何,如果其他人陷入同样的疯狂问题,我希望这个答案能有所帮助! :)
我是 Gulp 系统的新手,我正在尝试启动我的 AngularJS 应用程序并 运行。使用 Yeoman,我获得了一组标准的 gulp 任务,但其中一个任务失败并显示错误消息。我已将其缩小到特定行,但我对这个系统的了解还不够多,无法知道出现故障的原因或原因(当然,除了丢失文件的名称)。
失败的 gulp 文件如下:
const gulp = require('gulp');
const filter = require('gulp-filter');
const useref = require('gulp-useref');
const lazypipe = require('lazypipe');
const rev = require('gulp-rev');
const revReplace = require('gulp-rev-replace');
const uglify = require('gulp-uglify');
const cssnano = require('gulp-cssnano');
const htmlmin = require('gulp-htmlmin');
const sourcemaps = require('gulp-sourcemaps');
const uglifySaveLicense = require('uglify-save-license');
const ngAnnotate = require('gulp-ng-annotate');
const conf = require('../conf/gulp.conf');
gulp.task('build', build);
function build() {
const htmlFilter = filter(conf.path.tmp('*.html'), {restore: true});
const jsFilter = filter(conf.path.tmp('**/*.js'), {restore: true});
const cssFilter = filter(conf.path.tmp('**/*.css'), {restore: true});
return gulp.src(conf.path.tmp('/index.html'))
.pipe(useref({}, lazypipe().pipe(sourcemaps.init, {loadMaps: true})))
// .pipe(jsFilter)
// .pipe(ngAnnotate())
// .pipe(uglify({preserveComments: uglifySaveLicense})).on('error', conf.errorHandler('Uglify'))
// .pipe(rev())
// .pipe(jsFilter.restore)
// .pipe(cssFilter)
// .pipe(cssnano())
// .pipe(rev())
// .pipe(cssFilter.restore)
// .pipe(revReplace())
// .pipe(sourcemaps.write('maps'))
// .pipe(htmlFilter)
// .pipe(htmlmin())
// .pipe(htmlFilter.restore)
// .pipe(gulp.dest(conf.path.dist()));
}
如您所见,我已经注释掉了除违规行以外的所有内容。该行在构建过程中被调用时会产生以下错误消息:
[17:22:27] 'build' errored after 42 ms
[17:22:27] Error: Error: File not found with singular glob: C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\.tmp\jspm_packages\system.js
at DestroyableTransform.<anonymous> (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\gulp-useref\index.js:65:28)
at emitOne (events.js:101:20)
at DestroyableTransform.emit (events.js:188:7)
at emitOne (events.js:101:20)
at Through2.emit (events.js:188:7)
at OrderedStreams.<anonymous> (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\glob-stream\index.js:140:20)
at emitOne (events.js:96:13)
at OrderedStreams.emit (events.js:188:7)
at emitOne (events.js:96:13)
at DestroyableTransform.emit (events.js:188:7)
at Glob.<anonymous> (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\glob-stream\index.js:40:16)
at Glob.g (events.js:286:16)
at emitOne (events.js:96:13)
at Glob.emit (events.js:188:7)
at Glob._finish (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\glob-stream\node_modules\glob\glob.js:172:8)
at done (C:\Users\Jeffrey Getzin\Documents\GitHubVisualStudio\newclient\node_modules\glob-stream\node_modules\glob\glob.js:159:12)
[17:22:27] 'build' errored after 25 s
[17:22:27] 'default' errored after 25 s
[17:22:27] 'serve:dist' errored after 25 s
Process finished with exit code 1
显然,它正在 jspm 包的临时副本中寻找 system.js,但是 为什么? 为什么找不到它?该文件应该在那里吗?我不知道 gulp 脚本试图做什么,所以我不能冒险猜测它为什么不起作用。
我知道这可能不足以提供全面的答案,但我希望这里有足够的信息让您至少为我指明正确的方向。
谢谢!
2017 年 1 月 3 日更新
我有点明白 userref 应该做什么。我的 index.html 文件是
<!doctype html>
<html>
<head>
<base href="/">
<meta charset="utf-8">
<title>FountainJS</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="http://fountainjs.io/assets/imgs/fountain.png" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="css/camera.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
<!-- build:css(.tmp) index.css -->
<link rel="stylesheet" href="index.css"></link>
<!-- endbuild -->
</head>
<body class="front" ng-app="app">
<div id="main">
<ui-view></ui-view>
<page-footer></page-footer>
</div>
</body>
<!-- build:js(.tmp) index.js -->
<script src="jspm_packages/system.js"></script>
<script src="jspm.browser.js"></script>
<script src="jspm.config.js"></script>
<script>
System.import('src/index.ts');
</script>
<!-- endbuild -->
</html>
我认为应该发生的是它应该替换块:
<!-- build:js(.tmp) index.js -->
<script src="jspm_packages/system.js"></script>
<script src="jspm.browser.js"></script>
<script src="jspm.config.js"></script>
<script>
System.import('src/index.ts');
</script>
<!-- endbuild -->
和
<script src="tmp/index.js"></script>
这听起来正确吗?
我实际上找到了解决方案,但一点也不明显。据我所知,Gulp 的问题之一是,通过将所有内容分解为小的专有部分,很难看到全局。这意味着我需要深入研究才能发现问题所在。
在 userref 阶段 之前发生了错误。它是在管道执行 <index.html>.pipe(replace(<pattern-describing-the-existing-javascript-includes>, '<script src="index.js">')
.
我不记得 Yeoman 种子项目附带的确切正则表达式,但它对行应该如何终止存在偏见。正则表达式类似于:
/line1stuff\nline2stuff/
我花了很多调试时间才追踪到这一点,但我注意到正则表达式在正则表达式中工作,但当我进行实际替换时,没有任何内容被替换。
凭直觉,我尝试将正则表达式更改为:
/line1stuff[\n\r]+line2stuff/
这就解决了问题! (或者至少这个 特殊的 问题;我遇到了后续问题。)
伙计,这东西一点都不明显。我基本上不得不用 console.info
、console.warn
和 console.error
调用来填充我所有的 gulp 脚本,以跟踪我找到有问题的代码段的方式。
无论如何,如果其他人陷入同样的疯狂问题,我希望这个答案能有所帮助! :)