Gulp Concat JS results in require is not defined

问题

I have project using gulp.

I am trying to get jquery, jquery ui and bootstrap into one file called vendor.js.

This works fine however when I run "gulp serve" to run the project fromthe dist folder of the project i get the error

ReferenceError: require is not defined http://localhost:3000/assets/toolkit/scripts/vendor.js Line 6

var jQuery = require('jquery');

gulp.task('vendor-js', function() {
       return gulp.src(['src/assets/toolkit/scripts/vendor/jquery.min.js', 
       'src/assets/toolkit/scripts/vendor/jquery-ui.js', 
       'src/assets/toolkit/scripts/bootstrap/bootstrap.min.js' ])
       .pipe(concat('vendor.js'))
       .pipe(gulp.dest('dist/assets/toolkit/scripts/'));
});

Folder Structure

dist\assets\toolkit\scripts

dist\assets\toolkit\styles

dist\assets\toolkit\images

dist\pages

index.html

Why is this the case? I have looked all over with no luck! I have seen similar issues but all relating to react?

Can anyone help?

Thanks

NIck

回答1:

Managed to get this working eventually so I thought i would post my solution.

I reverted to using the built in toolkit.js file to require each dependency. In this case Jquery, Jquery Ui, Bootstrap Sass and Chart Js.

In my toolkit.js file i included

window.$ = window.jQuery = require('jquery'); require('jquery-ui'); require('bootstrap-sass'); require('chart.js');

This is then concatenated by my Gulp task.

The key is window.$ = window.jQuery = require('jquery');

rather than

require('jquery');

来源：https://stackoverflow.com/questions/37069465/gulp-concat-js-results-in-require-is-not-defined

标签

javascript

jquery

gulp

concat