具有browserify和babelify的模块?

我正在使用gulp,browserify和babelify以在我的项目中使用ES6语法。 只要我导入一个也写在ES6中的node_module,gulp会抛出一个错误: 'import' and 'export' may appear only with 'sourceType: module'

我已阅读babelify的github页面上提出的解决方案。 总之,这两种可能性是:

  • 为受影响的node_module的package.json添加一个browserify选项
  • 配置gulp,以便browserify尝试使用babelify转换所有文件(并为不必要的文件添加忽略选项)。
  • 第一个选项会阻止其他人克隆我的项目并立即启动并运行。 有没有解决方法,可能使用npm postinstall脚本?

    第二个选择似乎是一个矫枉过正的问题。 有没有更优雅的解决方案?


    Babelify有一个only选项,可以用来避免与正则表达式不匹配的文件转译。 与Browserify的global选项(默认情况下,转换不应用于node_modules目录中的文件)结合使用时,可以选择性地在node_modulesnode_modules文件。

    有了这个示例配置:

    browserify({ entries: ["index.js"] })
      .transform("babelify", {
        global: true,
        only: /^(?:.*/node_modules/(?:a|b)/|(?!.*/node_modules/)).*$/,
        presets: ["es2015"]
      })
      .bundle()
      .pipe(fs.createWriteStream("bundle.js"));
    

    不在node_modules内的文件将不会被编译,除非它们处于以下之一:

  • /node_modules/a
  • /node_modules/b
  • 如果您只需要一个node_modules下的目录进行node_modules ,则可以将正则表达式简化为:

    /^(?:.*/node_modules/a/|(?!.*/node_modules/)).*$/
    

    如果你有更多,你可以添加它们:

    /^(?:.*/node_modules/(?:a|b|c|d)/|(?!.*/node_modules/)).*$/
    
    链接地址: http://www.djcxy.com/p/32973.html

    上一篇: modules with browserify and babelify?

    下一篇: Using gulp with tsify and babelify isn't running babel