$ 未在 Gulp 任务中定义答案

【问题标题】：$ is not defined in Gulp task$ 未在 Gulp 任务中定义
【发布时间】：2016-09-12 17:34:28
【问题描述】：

我有以下 package.json 文件：

{
  "name": "ASP.NET",
  "version": "1.0.0",
  "devDependencies": {
    "gulp": "3.8.11",
    "gulp-inject": "1.5.0",
    "gulp-util": "3.0.6",
    "gulp-print": "1.1.0",
    "gulp-cssmin": "0.1.7",
    "gulp-uglify": "1.2.0",
    "gulp-load-plugins": "0.9.0",
    "del": "1.2.0",
    "wiredep": "3.0.0-beta",
    "jshint": "2.8.0",
    "jshint-stylish": "2.0.1"
  }
}

var gulp = require('gulp'),
    util = require('gulp-util'),
    print = require('gulp-print'),
    inject = require('gulp-inject'),
    del = require('del'),
    cssmin = require('gulp-cssmin'),
    jshint = require('gulp-jshint')
    uglify = require('gulp-uglify'),
    wiredep = require('wiredep').stream,
    bowerJson = require('./bower.json')
    gulp = require('gulp'),
    project = require('./project.json');

gulp.task('wiredep', function () {
    log('Placing Bower Components from ' + paths.bowerComponents + ' in ' + paths.layoutPage)
    return gulp
        .src(paths.layoutPage)
        .pipe(wiredep({
            bowerJson: bowerJson,
            directory: paths.bowerComponents,
            ignorePath: '../..'
        }))
        .pipe($.inject(gulp.src([
            paths.jsMain,
            paths.jsContent])))
        .pipe(gulp.dest(paths.layoutPage));
});

当我为 bower.json 运行此任务时，我收到错误：

[16:11:31] 使用 gulpfile C:\MyProject\src\MyProject\Gulpfile.js
[16:11:31] 开始'wiredep'...
[16:11:31] 将来自 ./bower_components/ 的 Bower 组件放置在 ./Views/Shared/_Layout.cshtml
[16:11:31] 'wiredep' 在 5.7 毫秒后出错
进程以代码 1 终止。
[16:11:31] ReferenceError: $ 未定义

为什么没有定义 $ 以及如何定义它？

我尝试将"jquery": "2.1.4", 添加到 package.json 中的 devDependencies。

【问题讨论】：

标签： gulp asp.net-core gulp-inject

【解决方案1】：

通过阅读gulp-inject documentation 的gulpfile.js 部分，我发现我不需要在它前面放置$。要求注入并直接引用它是有效的。例如，

var inject = require('gulp-inject'),

gulp.task('inject', ['wiredep'], function () {
    log('Wire up the css and js into ' + paths.layoutPage);
    return gulp
        .src(paths.layoutPage)
        .pipe(inject(gulp.src([paths.js, paths.css], { read: false }), { ignorePath: project.webroot }))
        .pipe(gulp.dest(paths.layoutPagePath));
});

我认为直接使用$ 可以使用var $ = require('jquery') 并将jquery 添加到package.json 中。如果我错了，请纠正我。

【讨论】：

【解决方案2】：

刚才我的项目也出现了这种现象。最后我发现gulp缺少一个名为'gulp-load-plugins'的插件；安装后我们应该声明它把 package.json 中的所有插件放到 $ 字符中；它是 var $=require('gulp-load-plugins')();

【讨论】：