问题描述
我有以下文件夹结构
DIST
SRC
模块1
m1.ts
模块2
m2.ts
.tsconfig.json
...
我 TSC
配置为输出到 DIST / JS
因此运行后 NPM运行TSC
我有以下内容:
DIST
JS
模块1
m1.js
模块2
m2.js
SRC
...
很多斗争后,我已成功地整合 NG-引导
到我的项目。
如果我导入
从 NG2-引导
在某处我的应用程序,例如:
进口{} ACCORDION_DIRECTIVES从'NG2自举/组件/手风琴';
和运行 NPM运行TSC
我的文件夹结构的变化为:
DIST
JS
node_modules
NG2自举
组件
手风琴
...
SRC
模块1
m1.js
模块2
m2.js
SRC
....
为什么会出现这种情况?
我包括:<脚本的src =/供应商/ NG2-引导/包/ NG2-bootstrap.js>< / SCRIPT>
在我 index.html的
我能够与angular2做到这一点<脚本的src =/供应商/ angular2 /包/ angular2.dev.js>< / SCRIPT>
和进口从'angular2 /核心
{组件},这不创建一个 DIST / JS / node_modules / angular2
文件夹
更新
下面是我tsconfig.json的内容
{
compilerOptions:{
目标:ES5
OUTDIR:./dist/js,
模块:系统
moduleResolution:节点,
sourceMap:真实,
emitDecoratorMetadata:真实,
experimentalDecorators:真实,
removeComments:假的,
noImplicitAny:假的
},
排除:[
node_modules
DIST
分型/主
分型/ main.d.ts
]
}
我已经找到了一个解决方案。显然,源 .TS
文件在同一目录 .d.ts
。因此,它编译这些文件。 (我读一路上这地方,我不知道的理由/为什么发生这种情况),但是,解决的办法是做删除所有 .TS
igoring *。d.ts
在 node_modules / NG2-引导文件
我创建了一个节点脚本
来做到这一点:
// ./scripts/hack-remove-files.js变种FS =要求('FS-额外)
VAR水珠=要求(水珠);VAR的选择= {忽略:** / * d.ts。'};水珠(node_modules / NG2-引导/ ** / *。TS,选项功能(呃,文件){
为(i的文件){
removeFile(文件[I]);
}
});水珠(node_modules / NG2文件上传/ ** / *。TS,选项功能(呃,文件){
为(i的文件){
removeFile(文件[I]);
}
});removeFile =函数(文件){
fs.remove(文件,函数(ERR){
如果(ERR)返回console.error(ERR)
})
}
我运行此作为一个NPM 安装后
脚本:
脚本:{
...
安装后:分型安装和放大器;&安培;节点./scripts/hack-remove-files.js
}
这仅需要做1次,下载包后。
另一个命令行的做法是:
找到node_modules / NG2-引导-name'* .TS| grep的-v'\\ .D \\ $ .TS| xargs的RM
修改
我发现原来的问题,即这是所有提到:
I have the following folder structure
dist
src
module1
m1.ts
module2
m2.ts
.tsconfig.json
...
I have tsc
configured to output to dist/js
so after running npm run tsc
I have the following:
dist
js
module1
m1.js
module2
m2.js
src
...
After much struggle I have managed to integrate ng-bootstrap
into my project.
If I import
from ng2-bootstrap
somewhere in my app, for example:
import { ACCORDION_DIRECTIVES } from 'ng2-bootstrap/components/accordion';
and run npm run tsc
my folder structure changes to:
dist
js
node_modules
ng2-bootstrap
components
accordian
...
src
module1
m1.js
module2
m2.js
src
....
Why is this happening?
I am including: <script src="/vendor/ng2-bootstrap/bundles/ng2-bootstrap.js"></script>
in my index.html
I am able to do this with angular2 <script src="/vendor/angular2/bundles/angular2.dev.js"></script>
andimport {Component} from 'angular2/core'
and this does not create a dist/js/node_modules/angular2
folder
Update
Here is the contents of my 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"
]
}
I have figured out a solution. Apparently the source .ts
files are in the same directory as the .d.ts
. and therefore it compiles these files. ( I read this somewhere along the way and I'm not sure the reasoning / why this happens ) however, the solution is to do remove all .ts
igoring *.d.ts
files in node_modules/ng2-bootstrap
I have created a node script
to do this:
// ./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)
})
}
I run this as a postinstall
script in npm:
"scripts": {
...
"postinstall": "typings install && node ./scripts/hack-remove-files.js",
}
This only needs to be done 1 time, after downloading the package.
another command line approach would be:
find node_modules/ng2-bootstrap -name '*.ts' | grep -v '\.d\.ts$' | xargs rm
EDIT
I have found the original issue where this is all mentioned: https://github.com/valor-software/ng2-bootstrap/issues/128
这篇关于导入NG2自举改变了我TSC输出的目录结构的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!