使用browserify使bower与npm一起工作

Question

我们既受到各种各样的JavaScript包管理解决方案的祝福和诅咒,所有这些都有各自的优点.由于这里无关紧要的原因,我已经确定了我的主要解决方案.但是,在其他系统(例如凉亭和组件)上有太多好的代码可以忽略这些解决方案.因此,我希望建立一个环境,我可以使用browserify从npm和bower加载包(我们将为另一个问题保存组件).

到目前为止,我提出的最好的方法是使用运行package.json的postinstall脚本来设置我bower install:

{
  ... configuration ...

  "scripts": {
    "postinstall": "bower install"
  }
}

这在构建第一级依赖项(即strait bower依赖项和strait npm依赖项)时构建正确的目录结构:

- MyMixedComponent
  - main.js
  - package.json
  - node_modules
    - npmDependency
  - bower_components
    - bowerComponent

使用browserify上的debowerify转换可以很好地构建,browserify -t debowerify 但是,当我想在另一个项目中从npm安装MyMixedComponent时npm install MyMixedComponent,目录结构就像你期望的那样构建了npm:

- MyNewProject
  - main.js
  - package.json
  - node_modules
    - MyMixedComponent
      - main.js
      - package.json
      - node_modules
        - npmDependency
      - bower_components
        - bowerComponent

由于bower是一个平面依赖树,当使用browserify和debowerify进行构建时,这当然不起作用.实际需要的是这样的:

- MyNewProject
  - main.js
  - package.json
  - node_modules
    - MyMixedComponent
      - main.js
      - package.json
      - node_modules
        - npmDependency
   - bower_components
     - bowerComponent

或者可以修改debowerify以识别多个凉亭目录,但这会破坏凉亭的可爱特性,即它是一棵扁平的树,这对于前端依赖性来说要好得多.关于这可能如何工作的任何想法,或者我应该祈祷我们总有一天会同意依赖管理？

Answer 1

在同一代码库中拥有多个 Bower_components 的想法存在引入某些特定框架的重复项的风险。

尝试走以下这条路：

1. 将混合（npm 和 Bower）包安装到我当前的包中时，
2. 像往常一样安装 npm （嵌套），
3. 并将每个凉亭组件从混合包bower install放入当前包的根目录
4. 交互式npm postinstall 脚本，只能更改当前包的 Bower.json
5. 并警告用户进行 Bower 安装，因为 Bower.json 现在已使用其他 npm/bower 混合包中的组件进行更新