Gulp и browserify дают ошибку: не удается найти модуль 'jquery' из 'C: ....' - PullRequest
0 голосов
/ 22 мая 2019

Я получаю ошибку:

Ошибка: не удается найти модуль 'jquery' из 'F: ... \ newstyle \ assets \ lib \ helper \ html \ img \ js'
в C: \ Users ... \ AppData \ Roaming \ npm \ node_modules \ browserify \ node_modules \ browser-resol \ \ node_modules \ resol \ \ lib \ async.js: 46: 17
в процессе (C: \ Users... \ AppData \ Roaming \ npm \ node_modules \ browserify \ node_modules \ browser-resol \ \ node_modules \ resol \ lib \ async.js: 173: 43)
в ondir (C: \ Users ... \ AppData \ Roaming\ npm \ node_modules \ browserify \ node_modules \ browser-resol \ \ node_modules \ resol \ lib \ async.js: 188: 17)
при загрузке (C: \ Users ... \ AppData \ Roaming \ npm \ node_modules \ browserify\ node_modules \ browser-resolve \ node_modules \ resol \ lib \ async.js: 69: 43)
в onex (C: \ Users ... \ AppData \ Roaming \ npm \ node_modules \ browserify \ node_modules \ browser-resolve\ node_modules \ resolution \ lib \ async.js: 92: 31)
в C: \ Users ... \ AppData \ Roaming \ npm \ node_modules \ browserify \ node_modules \ browser-resol \ \ node_modules \ resol \ lib \ async.js: 22: 47 на FSReqWrap.oncomplete (fs.js: 153: 21)

Моя структура каталогов следующая:

newstyle / assets / npm / index.js
newstyle / assets / npm/package.json
newstyle / assets / npm / gulpfile.js

newstyle / assets / lib / helper / html / img / js / img.module.js

Мой package.json выглядит так:

{
  "name": "newstyle",
  "version": "1.0.0",
  "description": "styles and libraries",
  "main": "index.js",
  "dependencies": {
    "@tschallacka/assetmanager": "^1.0.0",
    "@tschallacka/jquery.oc.foundation": "^1.0.2",
    "@tschallacka/jquery.render": "^1.0.0",
    "@tschallacka/jquery.request": "^1.0.0",
    "@tschallacka/oc.foundation.base": "^1.0.1",
    "@tschallacka/oc.foundation.controlutils": "^1.0.1",
    "@tschallacka/oc.foundation.request": "^1.0.0",
    "animate.css": "^3.7.0",
    "bootstrap-less": "^3.3.8",
    "flexslider": "^2.7.2",
    "font-awesome": "^4.7.0",
    "jquery": "^3.4.1",
    "jquery-touchswipe": "^1.6.19",
    "jquery.easing": "^1.4.1",
    "lazysizes": "^4.1.8",
    "liquidslider": "git+https://git@github.com/KevinBatdorf/liquidslider.git",
    "popper.js": "^1.15.0",
    "sweetalert2": "^8.11.1"
  },
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

Мой index.js выглядит так:

require('@tschallacka/oc.foundation.base');
require('@tschallacka/oc.foundation.controlutils');
// ====================== TROUBLE CAUSING LINE!! ==========================
require('../assets/lib/helper/html/img/js/img.module.js');

код в newstyle / assets / lib / helper / html / img / js /img.module.js

var $ = require('jquery');
var Base = require('@tschallacka/oc.foundation.base');
var controlUtils = require('@tschallacka/oc.foundation.controlutils');

Мой gulpfile.js

'use strict';

var browserify = require('browserify');
var gulp = require('gulp');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var uglify = require('gulp-uglify');
var sourcemaps = require('gulp-sourcemaps');
var log = require('gulplog');
var less = require('gulp-less');
var cssmin = require('gulp-cssmin');
var rename = require('gulp-rename');

gulp.task('javascript', function () {
  // set up the browserify instance on a task basis
  var b = browserify({
    entries: './index.js', // Source name
    debug: true
  });

  return b.bundle()
    .pipe(source('closure.js'))// Resulting filename
    .pipe(buffer())
    .pipe(sourcemaps.init({loadMaps: true}))
        // Add transformation tasks to the pipeline here.
        .pipe(uglify())
        .on('error', log.error)
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest('../js/'));
});

gulp.task('watch', function () {
  gulp.watch('./*.less', ['less']);
});

gulp.task('less', function () {

  return gulp.src('./style.less')
    .pipe(less({
         relativeUrls: true
    }).on('error', function (err) {
      console.log(err);
    }))
    .pipe(cssmin().on('error', function(err) {
      console.log(err);
    }))
    .pipe(rename('closure.css'))
    .pipe(gulp.dest('../css/'));

});

Когда я запускаю эту строку без проблем, все работает нормально, находит модули и компилируется безустройство.Нет проблем с поиском модулей.

Но когда мне требуется этот сценарий, модуль, который мне потребовался в качестве теста из «родительского» сценария, внезапно больше не может быть найден, даже если он все еще должен быть в кэше по строкеname.

Это работает, если мне «требуются» файлы по имени файла, но это менее чем желательно, потому что тогда мне постоянно приходится проверять вложение каталогов.

Что вызывает это и как я могу устранитьэто?

Вещи, которые я пробовал:

настройка basedir

var b = browserify({
    entries: './index.js', // Source name
    debug: true,
    basedir: __dirname
  });

npm обновление с 6.4.1 до 6.9.0

Set-ExecutionPolicy Unrestricted -Scope CurrentUser -Force
npm install -g npm-windows-upgrade
npm-windows-upgrade

обновленный глоток:

+ gulp@4.0.2
updated 6 packages in 19.938s

1 Ответ

0 голосов
/ 22 мая 2019

Решение довольно простое, но нелегко прийти к выводу, что вызывает ошибку, вы должны добавить node_modules в переменную browsrify 'paths' в вашем gulpfile.js

// set up the browserify instance on a task basis
var b = browserify({
  entries: './index.js', // Source name
  debug: true,
  paths: ['./node_modules'] // <--- this line here
});
...