Gulp 4 + browserify с использованием модулей и настроек экспорта - PullRequest
Новая
       83

Gulp 4 + browserify с использованием модулей и настроек экспорта

0 голосов
/ 05 ноября 2019

Я пытаюсь установить browserify и винил в моем текущем стартовом пакете gulp 4. У меня есть function js().., где моя логика для всех настроек JS. Основная идея заключается в том, чтобы иметь возможность экспортировать файл JSON из локальной оболочки nodejs (экспортировать код из C ++ с помощью этой оболочки, чтобы иметь возможность использовать его в nodejs). У меня есть локальные файлы базы данных в одной папке со всеми файлами c ++ .dll и одним файлом test.js, где мое соединение (запросы и логика) с файлами базы данных loca. Поэтому, когда я запускаю 'node test.js', я получаю обратно файл json (в терминале), который я хочу экспортировать в другой файл, где мне нужна эта информация из этого ответа (узел test.js) и чтобы я мог его использовать. Но у меня есть проблемы с настройкой какие-либо идеи, как я могу склеить эти вещи?

Я проверил много уроков, но они с gulp 3 или уже устарели. Самое последнее, что я нашел, это ссылка https://github.com/yeoman/generator-webapp/blob/master/docs/recipes/browserify.md, но у меня возникли проблемы с ее реализацией.

Так, например. 1. У меня есть папка project / src / js / main.js, где находится моя основная логика для страницы. 2. Мои базы данных и запросы хранятся в другой папке project / dbtest.

Я хочу иметь возможность экспортировать данные из проекта / dbtest, где находится мой исполняемый файл test.js (выполняется в терминале через узел test.js)это проект / src / js / main.js и использовать эти данные. 

const { src, dest, watch, series, parallel } = require('gulp');
const autoprefixer = require('gulp-autoprefixer');
const babel = require('gulp-babel');
const browserSync = require('browser-sync').create();
const cleancss = require('gulp-clean-css');
const del = require('del');
const sass = require('gulp-sass');
const sourcemaps = require('gulp-sourcemaps');
const uglify = require('gulp-uglify');
const webpack = require('webpack');
const webpackStream = require('webpack-stream');
const browserify = require('browserify');
const babelify = require('babelify');
const buffer = require('vinyl-buffer');
const source = require('vinyl-source-stream');

function html(done) {
  src('src/*.html')
    .pipe(dest('dist'))
  done();
}


function css(done) {
  src('src/scss/**/*.scss')
    .pipe(sourcemaps.init())
    .pipe(sass())
    .on("error", sass.logError)
    .pipe(autoprefixer('last 4 versions'))
    .pipe(cleancss())
    .pipe(sourcemaps.write('.'))
    .pipe(dest('dist/css'))
  done();
}
('default', ['copy:html', 'copy:css', 'copy:assets', 'webpack']);



function js(done) {
  const b = browserify({
    entries: 'src/js/**/*.js',
    transform: babelify,
    debug: true
  })


  return b.bundle()
    .pipe(source('bundle.js'))
    .pipe(buffer())
     .pipe(dest('.tmp/scripts'))
  // src('src/js/**/*.js')
    .pipe(sourcemaps.init())
    .pipe(babel({
      presets: ['@babel/preset-env']
      // presets: ['es2015']
    }))
    .pipe(uglify({
      mangle: {
        toplevel: true
      }
    }))
    .pipe(sourcemaps.write('.'))
    .pipe(dest('dist/js'))
  done();
}


function img(done) {
  src('src/img/**/*')
    .pipe(dest('dist/img'))
  done();
}

function watchFiles() {
  watch('src/*.html', series(html, reload));
  watch('src/scss/**/*.scss', series(css, reload));
  watch('src/js/*.js', series(js, reload));
  watch('src/img/**/*', series(img, reload));
}

function sync() {
  browserSync.init({
    server: 'dist',
    open: false
  });
}

function reload(done) {
  browserSync.reload();
  done();
}

function clean() {
  return del('dist');
}




exports.default = parallel(html, css, js, img, watchFiles, sync);
exports.build = series(clean, parallel(html, css, js, img));
exports.clean = clean;
...