Question

我有一个项目，其中有多个Angular应用程序和一个离子应用程序。我有许多类（模型）以及可以在所有应用程序之间共享的服务。

我的第一个想法是将共享文件放置在它们自己的单独目录/文件夹中，并创建一个符号链接。我试图启动离子应用程序，并且收到以下消息：

模块构建失败：错误： /home/norman/Work/vem-shared/shared-services/table/table.service.ts 在TypeScript编译中丢失。请确保它在您的tsconfig通过“文件”或“包含”属性。

搜索此错误消息后，我遇到了following，但这是针对较低角度的版本（我使用的是Angular 6和Ionic 4）。我还注意到许多关于符号链接在角度cli中不起作用的帖子-似乎适用于旧版本。

我想确定是否有人知道如何解决此错误，以及符号链接在角度应用程序/离子应用程序中是否起作用？

谢谢

Answer 1

对于 Angular Webapp ，该解决方案看起来很简单，只需添加 "preserveSymlinks": true到angular.json文件。

angular.json

{ 
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
        "my-project": {
            "root": "",
            "sourceRoot": "src",
            "projectType": "application",
            "architect": {
                "build": {
                    "builder": "@angular-devkit/build-angular:browser",
                    "options": {
                       "outputPath": "target",
                       "index": "src/index.html",
                       "main": "src/main.ts",
                       "tsConfig": "src/tsconfig.app.json",
                       "polyfills": "src/showcase/polyfills.ts",
                       "preserveSymlinks": true,
...

现在，如果要使用保留的符号链接创建库，则必须在tsconfig.lib.json中添加相同的功能，因为对于库，您没有angular.json

tsconfig.lib.json

"angularCompilerOptions": {
    "annotateForClosureCompiler": true,
    "skipTemplateCodegen": true,
    "strictMetadataEmit": true,
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true,
    "enableResourceInlining": true,
    "preserveSymlinks": true   },

对于 IONIC应用，symlink问题是一个长期悬而未决的问题，看来解决方案仍处于公开PR中。您可以跟踪progress here。

You can read more about the Angular webapp issue here

Answer 2

您可以使用可共享的服务/类创建Angular模块并将其放到NPM上。然后在所有应用程序上安装模块并使用它。您可以更新模块，并在所有应用程序代码基础上保持更新。

在Ionic和Angular应用程序之间共享代码

2 个答案: