Angular shared assets within multiple applications

Question

I am working on multiple small apps, which will share common and shared modules, and assets.

The part about how to create project structure was answered here: https://stackoverflow.com/a/61254557/1351452

My project folders structure is as follow: -root --projects ---app1 ---app2 ---library

1. I want to share assets (images and fonts) between apps and library (for example I have header component with logo)
2. I want to have one place for all the css (SCSS). Some compoents from shared library have also SCSS, but I think I should keep it separate (because within component, css code is added to index file tag)
3. Where should I keep that shared-assets folder, how to configure it for build and how to access from each app (import scss and get images and fonts).

Answer 1

Update: Octombre-2021 Angular 12.2.0

you must add object assets:

{
  "glob": "**/*",
  "input": "assets",
  "output": "assets"
}

project structure:

root
├── assets
│   ├── logo.png
│   └── ...
└── projects
    ├── app1
    │   ├── src
    │   │   ├── assets
    │   │   └── ...
    │   └── ...
    └── app2
        ├── src
        │   ├── assets
        │   └── ...
        └── ...

angular.json:

{
  ...
  "projects": {
    "app1": {
      "projectType": "application",
      ...
      "architect": {
        "build": {
          ...
          "options": {
            ...
            "assets": [
              "projects/app1/src/assets",
              {
                "glob": "**/*",
                "input": "assets",
                "output": "assets"
              }
            ],
          }
        }
      }
    },
    "app2": {
      "projectType": "application",
      ...
      "architect": {
        "build": {
          ...
          "options": {
            ...
            "assets": [
              "projects/app2/src/assets",
              {
                "glob": "**/*",
                "input": "assets",
                "output": "assets"
              }
            ],
          }
        }
      }
    }
  }
}

Original

Put assets in root folder: root/assets/

and change the path to assets in angular.json

{
  ...
  "projects": {
    "app1": {
      "projectType": "application",
      ...
      "architect": {
        "build": {
          ...
          "options": {
            ...
            "assets": [
              //  change this
              // "projects/app1/src/assets",
              "assets",
            ],
          }
        }
      }
    },
    "app2": {
      "projectType": "application",
      ...
      "architect": {
        "build": {
          ...
          "options": {
            ...
            "assets": [
              //  change this
              // "projects/app2/src/assets",
              "assets",
            ],
          }
        }
      }
    }
  }
}