- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
是否可以在angular cli的工作空间之外有一个库?
传统方案:
my-workspace/
... (workspace-wide config files)
projects/ (generated applications and libraries)
my-first-app/ --(an explicitly generated application)
... --(application-specific config)
e2e/ ----(corresponding e2e tests)
src/ ----(e2e tests source)
... ----(e2e-specific config)
src/ --(source and support files for application)
my-lib/ --(a generated library)
... --(library-specific config)
src/ --source and support files for library)
现在,我有一个库:my-lib2 驻留在另一个目录中,而不是在项目目录中。我将 my-lib2 的配置放在 my-workspace 的 angular.json 文件中,带有相对路径,但是,当我编译这个时:ng build my-lib2,在 workspace,我有这个错误:
Building Angular Package
** It is not recommended to publish Ivy libraries to NPM repositories **
------------------------------------------------------------------------------
Building entry point 'my-lib2'
------------------------------------------------------------------------------
Compiling TypeScript sources through ngc
ERROR: ../my-lib2/src/lib/my-lib2.component.ts(1,35): error TS2307: Cannot find module '@angular/core'.
../my-lib2/src/lib/my-lib2.module.ts(1,26): error TS2307: Cannot find module '@angular/core'.
../my-lib2/src/lib/my-lib2.service.ts(1,28): error TS2307: Cannot find module '@angular/core'.
../my-lib2/src/lib/my-lib2.service.ts(3,1): error TS2354: This syntax requires an imported helper but module 'tslib' cannot be found.
An unhandled exception occurred: ../my-lib2/src/lib/my-lib2.component.ts(1,35): error TS2307: Cannot find module '@angular/core'.
../my-lib2/src/lib/my-lib2.module.ts(1,26): error TS2307: Cannot find module '@angular/core'.
../my-lib2/src/lib/my-lib2.service.ts(1,28): error TS2307: Cannot find module '@angular/core'.
../my-lib2/src/lib/my-lib2.service.ts(3,1): error TS2354: This syntax requires an imported helper but module 'tslib' cannot be found.
See "/tmp/ng-bt10hE/angular-errors.log" for further details.
架构
my-lib2/
...
src/
my-workspace/
...
projects/
my-first-app/
...
e2e/
src/
...
src/
my-lib/
...
src/
angular.json在工作区内的配置:
...
...
"my-lib2": {
"projectType": "library",
"root": "projects/../../my-lib2/",
"sourceRoot": "projects/../../my-lib2/src",
"prefix": "lib",
"architect": {
"build": {
"builder": "@angular-devkit/build-ng-packagr:build",
"options": {
"tsConfig": "projects/../../my-lib2/tsconfig.lib.json",
"project": "projects/../../my-lib2/ng-package.json"
},
"configurations": {
"production": {
"tsConfig": "projects/../../my-lib2/tsconfig.lib.prod.json"
}
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "projects/../../my-lib2/src/test.ts",
"tsConfig": "projects/../../my-lib2/tsconfig.spec.json",
"karmaConfig": "projects/../../my-lib2/karma.conf.js"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"projects/../../my-lib2/tsconfig.lib.json",
"projects/../../my-lib2/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
}},
...
...
tsconfig.lib.ts(my-lib2的配置文件)
{
"extends": "../my-workspace/tsconfig.json",
"compilerOptions": {
"outDir": "../my-workspace/out-tsc/lib",
"target": "es2015",
"declaration": true,
"inlineSources": true,
"types": [],
"lib": [
"dom",
"es2018"
]
},
"angularCompilerOptions": {
"skipTemplateCodegen": true,
"strictMetadataEmit": true,
"enableResourceInlining": true
},
"exclude": [
"src/test.ts",
"**/*.spec.ts"
]
}
可以看出,所有路径都是相对的...
知道如何配置工作区 angular.json 中的条目以将库从 projects 路径中取出吗?
最佳答案
解决方案是正确配置库的 tsconfig.lib.ts 文件。
目录架构:
my-lib2/
...
src/
my-workspace/
...
projects/
my-first-app/
...
e2e/
src/
...
src/
my-lib/
...
src/
工作区中 angular.json 文件中的 my-lib2 条目:
"my-lib2": {
"projectType": "library",
"root": "../my-lib2",
"sourceRoot": "../my-lib2/src",
"prefix": "lib",
"architect": {
"build": {
"builder": "@angular-devkit/build-ng-packagr:build",
"options": {
"tsConfig": "../my-lib2/tsconfig.lib.json",
"project": "../my-lib2/ng-package.json"
},
"configurations": {
"production": {
"tsConfig": "../my-lib2/tsconfig.lib.prod.json"
}
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "../my-lib2/src/test.ts",
"tsConfig": "../my-lib2/tsconfig.spec.json",
"karmaConfig": "../my-lib2/karma.conf.js"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"../my-lib2/tsconfig.lib.json",
"../my-lib2/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
}},
my-lib2目录下的
tsconfig.lib.ts文件配置:
{
"extends": "../my-workspace/tsconfig.json",
"compilerOptions": {
"outDir": "../my-workspace/out-tsc/lib",
"target": "es2015",
"declaration": true,
"inlineSources": true,
"types": [],
"lib": [
"dom",
"es2018"
],
"baseUrl": "../my-workspace/",
"paths": {
"*": ["../my-workspace/node_modules/*"]
}
},
"angularCompilerOptions": {
"skipTemplateCodegen": true,
"strictMetadataEmit": true,
"enableResourceInlining": true
},
"exclude": [
"src/test.ts",
"**/*.spec.ts"
]
}
这是配置中的重要部分:
...
"baseUrl": "../my-workspace/",
"paths": {
"*": ["../my-workspace/node_modules/*"]
}
...
运行编译:
Building Angular Package
** It is not recommended to publish Ivy libraries to NPM repositories **
------------------------------------------------------------------------------
Building entry point 'my-lib2'
------------------------------------------------------------------------------
Compiling TypeScript sources through ngc
Bundling to FESM2015
Bundling to FESM5
Bundling to UMD
Minifying UMD bundle
Copying declaration files
Writing package metadata
Built my-lib2
------------------------------------------------------------------------------
Built Angular Package!
- from: /home/usuario/my-project/my-lib2
- to: /home/usuario/my-project/my-workspace/dist/my-lib2
------------------------------------------------------------------------------
关于Angular Cli 工作区之外的 Angular 库,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58729755/
我正在努力解决一个问题 Rahul 正在玩一个非常有趣的游戏。他有 N 个圆盘(每个圆盘的半径相等)。每个磁盘都有一个不同的数字,从 1 到 N 与之相关联。磁盘一个接一个地放在一堆中。 Rahul
我正在尝试使用此代码发出请求: public JsonObject account() throws BinanceApiException { return (new Request
我使用的是 Mac OS 和 emacs -nw (终端模式)。 我不知道如何在 emacs 之外粘贴东西(已由 M-w 在 emacs -nw 中实现)。 我知道emacs -ns可以做到。 搜索互
我试图让导航栏菜单出现在“标题容器”菜单中,但由于某种原因,导航栏链接流到外面(在修改浏览器窗口之前)。我不明白为什么,但我怀疑它与这一行有关: div class="collapse navbar-
我们的项目是在 WAS 6.1/hibernate/struts 上使用 RAD 7.0 开发的中型 Web 应用程序,该应用程序已投入生产。目前我们在属性文件中硬编码了生产系统的 IP 地址,在 h
我的要求是在传单中创建 N 类型的标记。该列表很大,无法容纳在 map 区域中。 我想要类似的东西: http://blog.georepublic.info/2012/leaflet-example
如 docs 中所述,基于 spring-boot 的 Web 服务正在使用 Sentry .它工作正常,但不应将某些异常发送到 Sentry ,例如为了在某些请求上返回 HTTP 状态 410
我已经阅读了 Apple Core Animation 文档。它说核心动画没有提供在窗口中实际显示图层的方法,它们必须由 View 托管。当与 View 配对时, View 必须为底层图层提供事件处理
我试图在滚动时检查元素是否在我的视口(viewport)内。如果它在我的视口(viewport)之外,我会添加一个类来将元素固定到顶部。 我用来确定元素是否在视口(viewport)之外的函数是: i
我正在查询中创建一个弹出窗口。悬停时弹出窗口一切正常。当用户的鼠标离开 div 以关闭它时,我让它看到计时器启动。如果他在计时器完成之前再次进入 div,则计时器将被清除。 这很好,但是如果用户点击
我使用名为 zonemap 的字典创建了一个 4x6 区域 map 。我在该字典中嵌套了多个字典;每个区域代表玩家可以访问并与之互动的区域。我希望能够将玩家的移动限制在该 4x6 区域,并重新显示他们
我正在构建一个页面,该页面将使用 ajax 来更新主要内容区域。用户将单击左侧菜单栏中的项目来更新右侧的 div 并包含搜索结果。 我想检测用户是否向下滚动到目前为止导致右侧结果 div 移出视口(v
好的,我在 div 中有一个带有拖放类的表格,其溢出设置为“自动”,这允许我隐藏部分时间表,只在底部放置一个滚动条。但是,我只是在可滚动 div 之外创建了一些可放置元素,并且我的可拖动元素无法离开可
我有大量项目绑定(bind)到 ListBox,VirtualizingStackPanel 设置为它的 ItemsPanel。随着用户滚动和项目容器的创建,我做了一些工作来用数据填充项目(使用数据库
我想知道是否有一种方法可以将类成员的访问范围专门限定为在 C# 中获取/设置实现,以减少我意外直接访问它们的可能性。类似 private 的东西,但只允许 get/set 访问它,我想我可以将每个变量
我正在尝试编写一个小游戏,以应用我自己在本类(class)中学到的概念。当游戏打开时,我想要一个自定义模态视图来告诉用户如何玩。同样,当他们输了时,我想呈现一个结果页面,该页面将位于 if 语句内。我
我有一个非常具体的 HTML/CSS 和/或 JS 问题。我在 this fiddle here 创建了一个示例显示问题。 我有一个可滚动的 div,它是一个表的父级: ...我的表格行之一包
我的 jar 文件中打包了一个 exe,我试图将它复制到一个临时位置,以便我可以使用 Desktop.browse() 运行它,为此我设置了一个使用 class.getResourceAsStream
您好,我对这段代码有疑问。我的问题是第一个 console.log(smile_per_sec) 给了我需要的值,但是第二个给了我声明变量时给它的值。 $.getJSON( twitter
我必须更改标记弹出窗口的默认大小以容纳我想放入其中的数据。我更改了一些 map 设置,因此当用户将其拖出 View 时,它总是会弹回最大范围。我遇到的问题是,对于靠近边缘的标记,当它的弹出窗口打开时,
我是一名优秀的程序员,十分优秀!