D3.js 和 browserify 有问题

Trouble with D3.js and browserify

我正在尝试将我的 javascript 代码与最新版本的 D3.js (4.10.2) 和 browserify 捆绑在一起,但它不起作用。错误出现在d3.json和d3.csv的请求函数中。无法加载文件,我收到以下错误:"Unexpected token T in JSON at position 0"。我认为这是配置问题,因为没有 browserify 代码工作得很好。我尝试了多种解决方案,例如 https://github.com/vigetlabs/blendid/issues/17,但不幸的是没有成功。我真的很困惑!

gulpfile.js:

const babel = require('babelify');
const browserify = require('browserify');
const gulp = require('gulp');
const gutil = require('gulp-util');
const source = require('vinyl-source-stream');

gulp.task('browserify', function () {

  return browserify({
    entries: ['./src/js/index.js'],
    extensions: ['.js'],
    paths: ['./node_modules', './src/js/']
  })
    .transform(babel)
    .bundle()
    .on('error', gutil.log.bind(gutil, 'Browserify Error'))
    .pipe(source('index.js'))
    .pipe(gulp.dest('./dist/js/'));
});

gulp.task('default', ['browserify']);

文件结构:

/src
  /css
  /data
  /js
  index.html

文件加载:

d3.queue()
  .defer(d3.json, 'data/file1.json')
  .defer(d3.json, 'data/file2.json')
  .await((error, file1Result, file2Result) => { ... });

也许你们有想法!

这是我的问题的可能解决方案:https://github.com/d3/d3-request/issues/24#issuecomment-328945696

它对我有用,但它只是一个 hack!

我希望很快会有一个永久性的解决方案。