强制Browserify转换依赖关系？

Question

我正在同时处理两个Node包,我们称之为Library和Consumer.Library负责在浏览器中呈现大量内容.消费者所做的就是import Library from 'library'打电话Library(someConfigHere)- 它基本上只是一个测试,以确保库在浏览器中做我期望的事情.

我已经将npm linkLibrary编辑为Consumer并且我正在尝试在Consumer上运行Browserify,但是我收到了这个错误:ParseError: 'import' and 'export' may appear only with 'sourceType: module'.库确实包含ES6 export语句,所以我猜测Browserify只针对Consumer而不是Library运行.

所以我的问题是:有没有办法强制Browserify转换依赖项？

这是我的package.json:

{
  "name": "consumer",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "budo index.js --port $PORT",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-preset-es2015": "^6.13.2",
    "babel-preset-react": "^6.11.1",
    "babelify": "^7.3.0",
    "browserify-shim": "^3.8.12"
  },
  "browserify": {
    "transform": [
      "babelify"
    ]
  },
  "babel": {
    "presets": [
      "es2015",
      "react"
    ]
  }
}

这是消费者的index.js:

import Library from 'library'  // <= this is what isn't getting babelified

console.log(Library);

这是图书馆的index.js:

export default (config) => {
    console.log('Testing testing')
}

Answer 1

Browserify转换可以配置为全局转换,这意味着它们也将应用于其中的文件node_modules.

配置是per-transform.有了babelify,你可以像这样配置它:

browserify().transform("babelify", {
  global: true
})

或者,如果您使用命令行,如下所示:

browserify ... -t [ babelify --global ] ...

或者,要在其中配置它package.json,它应该是这样的(注意添加的方括号):

"browserify": {
  "transform": [
    ["babelify", { "global": true }]
  ]
}

Babelify还实现了一个ignore选项,因此可以将其配置为仅转换node_modules您想要的文件.有更多的信息在这里.

另一种解决方案是在模块中包含类似的browserify/ babelify配置.处理依赖项时,Browserify将检查所述依赖项的文件以进行转换,并将应用任何已配置的文件.librarypackage.jsonpacakge.json