- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在努力在 AngularJS 中构建 Instagram 克隆,并按照此处的指南进行操作。
https://hackhands.com/building-instagram-clone-angularjs-satellizer-nodejs-mongodb/
我目前处于第 19 部分,我正在尝试缩小 JavaScript 文件以提高网站性能。为此,他们建议使用名为 Gulp
的任务运行程序。
在我的 gulpfile.js 中,我声明了我需要的所有依赖项
var gulp = require('gulp');
var csso = require('gulp-csso');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var recess = require('gulp-recess');
var header = require('gulp-header');
var gulpFilter = require('gulp-filter');
var complexity = require('gulp-complexity');
var ngAnnotate = require('gulp-ng-annotate');
var templateCache = require('gulp-angular-templatecache');
我确保它们已通过 npm install --save-dev depName
安装在我的 package.json
文件中
这是我的缩小任务代码
gulp.task('minify', function() {
var templatesFilter = gulpFilter('clients/views/*.html');
return gulp.src([
'client/vendor/angular.js',
'client/vendor/*.js',
'client/app.js',
'client/templates.js',
'client/controllers/*.js',
'client/services/*.js',
'client/directives/*.js'
])
.pipe(templatesFilter)
.pipe(templateCache({ root: 'views', module: 'Instagram' }))
.pipe(templatesFilter.restore())
.pipe(concat('app.min.js'))
.pipe(ngAnnotate())
.pipe(uglify())
.pipe(header(banner))
.pipe(gulp.dest('client'));
});
在命令行中,我尝试通过gulp minify
运行任务,但得到以下输出
Working directory changed to ~\Documents/tutorials/Angular-Instagram
Using gulpfile ~\Documents\tutorials\Angular-Instagram\gulpfile.js
Starting 'minify'
TypeError: undefined is not a function
at Gulp.<anonymous> (Documents\tutorials\Angular-Instagram\gulpfile.js:34.31)
然后我转到 gulpfile.js 中的第 34 行
.pipe(templatesFilter.restore())
显然它与gulp-filter
中的restore()
函数有关
按照指南的建议,我在 index.html 文件中注释掉了脚本标签
<!--<script src="vendor/angular.js"></script>-->
<!--<script src="vendor/angular-route.js"></script>-->
<!--<script src="vendor/angular-messages.js"></script>-->
<!--<script src="vendor/satellizer.js"></script>-->
<!--<script src="services/api.js"></script>-->
<!--<script src="controllers/home.js"></script>-->
<!--<script src="controllers/navbar.js"></script>-->
<!--<script src="controllers/login.js"></script>-->
<!--<script src="controllers/signup.js"></script>-->
<!--<script src="controllers/detail.js"></script>-->
<!--<script src="directives/serverError.js"></script>-->
<script src="app.min.js"></script>
这是 gulp-filter 的文档
https://www.npmjs.com/package/gulp-filter
有什么想法吗?
最佳答案
尝试.pipe(templatesFilter.restore)
,如文档中所示。可能 restore
不是一个函数,或者没有直接调用它。
工作解决方案:
更改此行:var templatesFilter = gulpFilter('clients/views/*.html', {restore: true});
关于javascript - Gulp 缩小任务 - 类型错误 : undefined is not a function,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31968905/
我是一名优秀的程序员,十分优秀!