A
A
Alexey Ermolaev2016-03-09 18:08:16
npm
Alexey Ermolaev, 2016-03-09 18:08:16

Gulp: gulp-include does not see nested directories - how to fix?

The frontend of the project is running on a node local server and is assembled using gulp. The entire frontend was torn out of the project on rails and rewritten for the node.
There are two folders - src and dist. src contains the source code. The server serves files from the dist folder.
The js folder has one main file, application.js, which must contain all other files using the gulp-include module, so it contains only directives:

//= stub head
//= require jquery

//= require_self

// plugins
//= require_tree ./application/plugins
//= require application/grill-init
//= require application/error-views
//= require application/local-chrome-info
//= require application/footer

// utils
//= require application/utils/adfox
//= require application/utils/background-styles
//= require application/utils/cookie
//= require application/utils/css-manager
//= require application/utils/disney-user
//= require application/utils/getscript
//= require application/utils/module-background-util
//= require application/utils/module-capabilities
//= require application/utils/pizza-delivery
//= require application/utils/tinycolor
//= require application/utils/title-util
//= require application/utils/tracking
//= require application/utils/yandex-share
//= require application/plugins/scale.animation
//= require moment-with-locales.min

// addons
//= require_tree ./application/addons

// fixins
//= require_tree ./fixins

// components
//= require_tree ./components

According to the module description https://www.npmjs.com/package/gulp-include , the require_tree directive is obsolete, and the file itself contains syntactically errors (extra spaces, etc.).
Therefore, the script task in gulpfile looks like this:
var include = require("gulp-include");
var rename = require('gulp-rename');

gulp.task("scripts", function() {

    gulp.src(["./src/js/**/*.js", './src/js/**/*.js.erb'])
        .pipe(replace(/\/\/= require_tree/g, '\/\/=require_tree'))
        .pipe(replace(/\/\/= require /g, '\/\/=require '))
        .pipe(replace(/require (\S*)\n/g, 'require $1.js\n'))
        .pipe(replace(/require_tree (\S*)\n/g, 'require $1\/\*\*\/\*.js\n'))
        //.pipe(gulp.dest("./dist/js/"))
        .on('end', function () {

            gulp.src(["./dist/js/head.js.erb", "./dist/js/application.js.erb"])
                .pipe(include())
                .on('error', console.log)
                .pipe(rename({extname: '.js'}))
                .pipe(gulp.dest("./dist/js/"));
        });
});

That is, require_tree should be replaced with require with a global path.
When compiled, gulp produces the following:
[17:31:46] Using gulpfile ~/Documents/work/сompany/project/gulpfile.js
[17:31:46] Starting 'scripts'...
[17:31:46] Finished 'scripts' after 17 ms
{ [Error: EISDIR: illegal operation on a directory, read] errno: -21, code: 'EISDIR', syscall: 'read' }

at the output in dist I get the same application.js.erb, a new application.js file is not created.
Removing and inserting lines in application.js by typing helped determine that the problem lies, including at the stage when directives with require_tree are compiled and something else - gulp cannot get into all directories, that is, it does not recognize them like directories. Or is the problem something else? Thank you.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question