如何使用gulp将js + json文件导入另一个js文件?

我是gulp的新手,目前在一个自由项目上工作,在那里给我预先编写的gulpfile.js,并要求在项目上使用它。我习惯于使用webpack模块轻松导入/导出JS文件,在这里我不明白如何将一个JS文件链接到另一个。

我已经尝试将browserify添加到捆绑文件中,但是当我尝试将browserify(main.js)添加到gulpfile.js脚本任务中时,出现下一个错误:“ browserify()不是函数”。 当我没有运行gulp dev时,出现“ ReferenceError:未定义require”。

我的项目大纲: -js(文件夹)> main.js,rooms.js,main.min.js; -模板(文件夹)> rooms.json;

我正在尝试使用以下方法将rooms.json和rooms.js导入main.js var rooms = require('../templates/rooms.json');

我的gulpfile.js

  sass = require('gulp-sass'),browserSync = require('browser-sync').create(),autoprefixer = require('gulp-autoprefixer'),rename = require('gulp-rename'),svgmin = require('gulp-svgmin'),svgstore = require('gulp-svgstore'),cheerio = require('gulp-cheerio'),webp = require('gulp-webp'),imagemin = require('gulp-imagemin'),imageminPngquant = require('imagemin-pngquant'),imageminmozjpeg = require('imagemin-mozjpeg'),cssnano = require('gulp-cssnano'),uglify = require('gulp-uglify'),babel = require('gulp-babel');

// Development Tasks
// -----------------

// Start browserSync server
gulp.task('browserSync',function () {
  browserSync.init({
    server: {
      baseDir: '.'
    },notify: false
  });

  gulp.watch('./scss/**/**/*.scss',gulp.parallel('sass'));
  gulp.watch('./*.html').on('change',browserSync.reload);
  gulp.watch('./js/**/main.js',gulp.parallel('scripts'));
});

gulp.task('sass',function () {
  return gulp
    .src('./scss/style.scss')
    .pipe(sass().on('error',sass.logError))
    .pipe(
      autoprefixer({
        browsers: ['last 2 versions'],cascade: false
      })
    )
    .pipe(gulp.dest('./css'))
    .pipe(cssnano())
    .pipe(rename('style.min.css'))
    .pipe(gulp.dest('./css'))
    .pipe(browserSync.stream());
});

gulp.task('scripts',function () {
  return gulp
    .src('./js/main.js')
    .pipe(rename('main.min.js'))
    .pipe(babel({ presets: ['@babel/env'] }))
    .pipe(uglify())
    .pipe(gulp.dest('js/'))
    .pipe(browserSync.stream());
});

// Watchers
gulp.task('watch',gulp.series('sass','browserSync'));

// Optimization Tasks
gulp.task('webp',() =>
  gulp
    .src('./img/hero_*.{jpg,png}')
    .pipe(webp())
    .pipe(gulp.dest('./img/'))
);

gulp.task('imagemin',() =>
  gulp
    .src('img/*.{jpg,png}')
    .pipe(
      imagemin(
        [
          (imageminPngquant({
            speed: 1,quality: 98 //lossy settings
          }),imageminmozjpeg({
              quality: 90
            }))
        ],{
          verbose: true
        }
      )
    )
    .pipe(gulp.dest('img/'))
);

// Sprites
gulp.task('sprite',function () {
  return gulp
    .src('./img/icon-*.svg')
    .pipe(svgmin())
    .pipe(svgstore({ inlinesvg: true }))
    .pipe(
      cheerio({
        run: function ($) {
          $('[fill]').removeAttr('fill');
          $('svg').attr('style','display:none');
        },parserOptions: { xmlMode: true }
      })
    )
    .pipe(rename('sprite.svg'))
    .pipe(gulp.dest('./img/'));
});

gulp.task(
  'dev',gulp.series(
    gulp.parallel('sass','scripts','webp','imagemin','sprite'),'browserSync'
  )
);

Package.json

    "name": "project","version": "1.0.0","description": "","main": "gulpfile.js","scripts": {
        "test": "echo \"Error: no test specified\" && exit 1"
    },"author": "","license": "ISC","devDependencies": {
        "@babel/core": "^7.3.4","@babel/preset-env": "^7.7.1","browser-sync": "^2.26.3","cheerio": "^1.0.0-rc.2","del": "^2.2.2","gulp": "^4.0.2","gulp-autoprefixer": "^6.0.0","gulp-babel": "^8.0.0","gulp-cheerio": "^0.6.3","gulp-concat": "^2.6.1","gulp-cssnano": "^2.1.3","gulp-declare": "^0.3.0","gulp-gh-pages": "^0.5.4","gulp-imagemin": "^4.1.0","gulp-rename": "^1.4.0","gulp-sass": "^3.2.1","gulp-svgmin": "^1.2.3","gulp-svgstore": "^6.1.0","gulp-uglify": "^3.0.2","gulp-webp": "^3.0.0","gulp-wrap": "^0.15.0"
    },"dependencies": {
        "gulp-browserify": "^0.5.1","gulp-cli": "^2.2.0","imagemin-mozjpeg": "^8.0.0","imagemin-pngquant": "^7.0.0","tunnel-agent": "^0.6.0","vinyl-source-stream": "^2.0.0"
    }
}```
ap0705122 回答:如何使用gulp将js + json文件导入另一个js文件?

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/3132400.html

大家都在问