导入 ng2-bootstrap 会改变我的 tsc 输出目录结构答案

【问题标题】：Importing ng2-bootstrap changes my tsc output directory structure导入 ng2-bootstrap 会改变我的 tsc 输出目录结构
【发布时间】：2016-02-26 09:49:17
【问题描述】：

我有以下文件夹结构

dist
src
  module1
    m1.ts
  module2
    m2.ts
.tsconfig.json
...

我已将tsc 配置为输出到dist/js，因此在运行npm run tsc 后，我有以下内容：

dist
    js
      module1
          m1.js
      module2
          m2.js
src
...

经过一番努力，我设法将ng-bootstrap 集成到我的项目中。

如果我在我的应用程序某处从ng2-bootstrap import import，例如：

import { ACCORDION_DIRECTIVES } from 'ng2-bootstrap/components/accordion';

并运行npm run tsc 我的文件夹结构更改为：

dist
    js
      node_modules
          ng2-bootstrap
             components
                accordian
                ...
      src
          module1
             m1.js
          module2
             m2.js
src
....

为什么会这样？

我的index.html 中包括：<script src="/vendor/ng2-bootstrap/bundles/ng2-bootstrap.js"></script>

我可以用 angular2 做到这一点 <script src="/vendor/angular2/bundles/angular2.dev.js"></script> 和 import {Component} from 'angular2/core'，这不会创建 dist/js/node_modules/angular2 文件夹

更新

这是我的 tsconfig.json 的内容

{
  "compilerOptions": {
    "target": "ES5",
    "outDir": "./dist/js",
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules",
    "dist",
    "typings/main",
    "typings/main.d.ts"
  ]
}

【问题讨论】：

你能给我们你的tsconfig.json吗？谢谢！
另外可能值得一提的是，我在tsconfig.json 中设置了"rootDir": "./src"，在"import .. from "ng2-bootstrap.." 之前一直很好，然后在运行npm run tsc 时我会收到错误..node_modules/ng2-bootstrap/components/accordion.ts' is not under 'rootDir' 'src'.
引用这个 repo 结构 github.com/MrPardeep/Angular2-DatePicker 看起来和这个 repo 的结构一样
我也有同样的问题。导入 ng2-bootstrap 在我的 dist 文件夹中创建 node_modules 作为 src 的兄弟（如果不存在 ng2-bootstrap 导入，编译的内容将直接进入 dist）。我提供赏金，以引起打字员的注意。

标签： typescript angular tsc ng2-bootstrap

【解决方案1】：

我想出了一个解决办法。显然源.ts 文件与.d.ts 位于同一目录中。因此它编译这些文件。（我在某处读到了这篇文章，但我不确定原因/为什么会发生这种情况）但是，解决方案是删除node_modules/ng2-bootstrap 中的所有.ts igoring *.d.ts 文件@

我创建了一个node script 来执行此操作：

// ./scripts/hack-remove-files.js

var fs = require('fs-extra')
var glob = require("glob");

var options = { ignore: '**/*.d.ts'};

glob("node_modules/ng2-bootstrap/**/*.ts", options, function (er, files) {
    for(i in files){
        removeFile(files[i]);
    }
});

glob("node_modules/ng2-file-upload/**/*.ts", options, function (er, files) {
    for(i in files){
        removeFile(files[i]);
    }
});

removeFile = function(file){
    fs.remove(file, function (err) {
        if (err) return console.error(err)
    })
}

我在 npm 中将其作为 postinstall 脚本运行：

"scripts": {
   ...
   "postinstall": "typings install && node ./scripts/hack-remove-files.js",
}

下载包后，只需执行 1 次。

另一种命令行方法是：

find node_modules/ng2-bootstrap -name '*.ts' | grep -v '\.d\.ts$' | xargs rm

编辑

我找到了所有提到的原始问题：https://github.com/valor-software/ng2-bootstrap/issues/128

【讨论】：