时间戳

首页 > 解决方案 > 在 Ionic 和 Angular 应用程序之间共享代码

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

问题描述

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

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

模块构建失败：错误：TypeScript 编译中缺少 /home/norman/Work/vem-shared/shared-services/table/table.service.ts。请通过 'files' 或 'include' 属性确保它在您的 tsconfig 中。

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

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

谢谢

标签： angularionic-framework

解决方案

对于Angular webapp"preserveSymlinks": true ，通过添加到 angular.json 文件，解决方案似乎非常简单 。

角.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 应用程序，符号链接问题是一个长期悬而未决的问题，似乎解决方案仍在公开 PR 中。您可以在此处跟踪进度。

您可以在此处阅读有关 Angular webapp 问题的更多信息

推荐阅读