gulp-browserify输出与应有的不同

时间:2016-11-23 09:49:36

标签: javascript gulp browserify

我正在使用glup with browserify来连接,babelify和浏览几个js库。这是在我的gulpfile.js:

gulp.task('scripts', function () {
  var b = browserify({
    entries: ['src/scripts/modernizr.js', 'src/scripts/main.js'],
    debug: true
  }).transform(babelify, { presets: ["latest"] });

  return b.bundle()
    .pipe(source('main.js'))
    .pipe(buffer())
    .pipe(sourcemaps.init({loadMaps: true}))
        // Add transformation tasks to the pipeline here.
        // .pipe(uglify())
        .on('error', gutil.log)
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest('build/js/'));
});

我的package.json:

"browserify": {
  "transform": [
    [
      "babelify",
      {
        "presets": [
          "es2015"
        ]
      }
    ]
  ]
}

在我的main.js中,这就是我包含库的方式:

var $ = window.jquery;
import tinymce from 'tinymce/tinymce';
import 'tinymce/themes/modern/theme';
// import spica from 'spica';
// import localsocket from 'localsocket';
var spica = require('spica');
var localsocket = require('localsocket');
import Pjax from 'pjax-api';

但是我在控制台中收到以下错误:

pjax-api.js:8Uncaught Error: Cannot find module 'spica'
    at s (http://localhost:8000/static/articles/build/js/main.js:1:148)
    at http://localhost:8000/static/articles/build/js/main.js:1:305
    at s (http://localhost:8000/static/articles/build/js/main.js:12699:28)
    at http://localhost:8000/static/articles/build/js/main.js:12708:24
    at Object.r.42.../../../lib/dom (http://localhost:8000/static/articles/build/js/main.js:14446:27)
    at s (http://localhost:8000/static/articles/build/js/main.js:12706:21)
    at http://localhost:8000/static/articles/build/js/main.js:12708:24
    at Object.r.41../gui (http://localhost:8000/static/articles/build/js/main.js:14429:25)
    at s (http://localhost:8000/static/articles/build/js/main.js:12706:21)
    at http://localhost:8000/static/articles/build/js/main.js:12708:24
    at Object.r.4../layer/interface/service/api (http://localhost:8000/static/articles/build/js/main.js:12738:25)
    at s (http://localhost:8000/static/articles/build/js/main.js:12706:21)
    at http://localhost:8000/static/articles/build/js/main.js:12708:24
    at Object.r.pjax-api../src/export (http://localhost:8000/static/articles/build/js/main.js:15017:22)
    at s (http://localhost:8000/static/articles/build/js/main.js:12706:21)
    at e (http://localhost:8000/static/articles/build/js/main.js:12715:9)
    at Object.3 (http://localhost:8000/static/articles/build/js/main.js:12717:2)
    at s (http://localhost:8000/static/articles/build/js/main.js:1:254)
    at http://localhost:8000/static/articles/build/js/main.js:1:305
    at Object.8.jquery (http://localhost:8000/static/articles/build/js/main.js:67062:16)
    at s (http://localhost:8000/static/articles/build/js/main.js:1:254)
    at e (http://localhost:8000/static/articles/build/js/main.js:1:425)
    at http://localhost:8000/static/articles/build/js/main.js:1:443

这是我的目录结构:

articles
  |--gulpfile.js
  |--package_json
  |--build
  |  |--img
  |  |--css
  |  |--js
  |  |  |--main.js
  |--src
  |  |--img
  |  |--styles
  |  |--scripts
  |  |  |--main.js
  |--node_modules
  |  |--spica
  |  |--localsocket
  |  |--pjax-api
  |  |--etc.

出了什么问题?

main.js的完整输出太大而无法粘贴,但here it is in a gist。这是rest of my code in another gist

2 个答案:

答案 0 :(得分:0)

您是否安装了spica-package?如果没有,试试这个:

npm install --save-dev spica

答案 1 :(得分:0)

如果您的'spica'出现在main.js存在的同一目录中,则其罚款或其他

您必须指定

像这样, var spica = require(dir_path / spica.js)

分享您的目录结构,以便我可以为您提供准确的语法。