共享组件设置
我有一个共享的角度组件,作为辅助入口点,有许多量角器实用程序,可以更轻松地从使用中的应用程序进行测试。我们不做monorepo,因此存储库仅专用于该特定共享组件。我们使用git url通过npm
分发该共享组件。这里大致是项目结构:
-. (root folder)
|-.dist
| |- shared-component (distributables)
|
|-.projects
| |
| |-. shared-component (sources - library)
| | |
| | |-. e2e-utils
| | | |- public_api.ts
| | | |- package.json (2nd entry point)
| | | |- ... (sources)
| | |
| | |-. src
| | | |-. lib
| | | | |- ... (sources)
| | | |- public_api.ts
| | |
| | |- package.json (1st entry point)
| |
| |- test-harness (demo - application)
|
|- angular.json
|- package.json
|- tsconfig.json
在angular.json
中:
shared-component
被定义为library
test-harness
被定义为application
在package.json
中:
"files": [ "dist/shared-component" ],
"main": "dist/shared-component/bundles/shared-component.umd.js",
"module": "dist/shared-component/fesm5/shared-component.js",
"es2015": "dist/shared-component/fesm2015/shared-component.js",
"esm5": "dist/shared-component/esm5/shared-component.js",
"esm2015": "dist/shared-component/esm2015/shared-component.js",
"fesm5": "dist/shared-component/fesm5/shared-component.js",
"fesm2015": "dist/shared-component/fesm2015/shared-component.js",
"typings": "dist/shared-component/shared-component.d.ts",
"metadata": "dist/shared-component/shared-component.metadata.json",
在tsconfig.json
中:
"paths": {
"shared-component": [
"dist/shared-component"
],
"shared-component/*": [
"dist/shared-component/*"
]
}
使用应用程序设置
在package.json
中:
"dependencies": {
...
"shared-component": "git+<git-url>#<version>"
...
}
在app.module.ts
中:
import { SharedComponentModule } from 'shared-component';
在some.e2e.test.ts
中:
import { E2EUtils } from 'shared-component/dist/shared-component/e2e-utils'
问题
如何将以上内容简化为一个简单的
import { E2EUtils } from 'shared-component/e2e-utils'
奇妙的解决方案
在使用方应用程序的tsconfig.json
和 foreach 中使用共享对象-
"paths": {
...
"shared-component/*": [
"node_modules/shared-component/dist/shared-component/*"
],
...
},
我不喜欢这种解决方案,因为它会强制为每个消耗的包裹添加一个额外的条目 ,这是开销。我想相信那里有更好的解决方案(以前我做错了)。
文学