На примере bootstrap.
Стили бустрапа подключаете непосредственно в вашем scss.
Js бутстрапа подключаете в gulp:
const gulp = require('gulp'),
sass = require('gulp-sass'),
concat = require('gulp-concat'),
hb = require('gulp-hb'),
rename = require('gulp-rename'),
changed = require('gulp-changed'),
print = require('gulp-print'),
path = require('path'),
browserSync = require('browser-sync').create(),
runSequence = require('run-sequence'),
fs = require('fs'),
del = require('del'),
handlebarsLayouts = require('handlebars-layouts');
const DIR_ROOT = fs.realpathSync('./'),
DIR_SRC = DIR_ROOT + '/src',
DIR_PUBLIC = DIR_ROOT + '/public',
DIR_DIST = DIR_PUBLIC + '/dist';
gulp.task('js-libs', function() {
return gulp.src([
'./node_modules/jquery/dist/jquery.min.js',
'./node_modules/tether/dist/js/tether.min.js',
'./node_modules/popper.js/dist/umd/popper.js',
'./node_modules/путь к 4 бустрапу/bootstrap.min.js'
])
.pipe(concat('libs.js'))
.pipe(gulp.dest(DIR_DIST + '/js/'))
.pipe(browserSync.stream());
});
gulp.task('js-template', function() {
return gulp.src([
DIR_SRC + '/index.js'
])
.pipe(concat('index.js'))
.pipe(gulp.dest(DIR_DIST + '/js/'))
.pipe(browserSync.stream());
});
gulp.task('scripts', function() {
runSequence('js-libs', 'js-template');
});
gulp.task('fonts-awesome', function() {
return gulp.src(['./node_modules/font-awesome/fonts/*'])
.pipe(gulp.dest(DIR_DIST + '/fonts/'))
.pipe(browserSync.stream());
});
gulp.task('fonts', function() {
runSequence('fonts-awesome');
});
gulp.task('build-cleanup', function() {
return del.sync(DIR_PUBLIC);
});
gulp.task('build-all', [
'fonts',
'scripts'
]);
gulp.task('build', function() {
return runSequence(
'build-cleanup',
'build-all'
);
});
gulp.task('serve', function() {
browserSync.init({
localOnly : true,
port : 8080,
server : {
baseDir : DIR_PUBLIC
},
ui : {
port : 8081
}
});
gulp.watch(DIR_SRC + '/scripts/**/*', ['scripts']);});
gulp.task('watch', function() {
runSequence(
'build',
'serve'
);
});
Примерно так