0

I'm working with angular 8, I created a sub-project inside the main project. The folder structure looks like the screenshot: project structure. ignored unnecessary folders

Now I'm working on my sub-proj01, and I want to use an "img" tag to import an xxx.svg file inside the sub-proj01's assets folder.

I tried

<img src="assets/xxx.svg">

, but I got 404 after I run ng serve in the aggregator folder.

and I tried

<img src="projects/sub-proj01/src/assets/xxx.svg">

but I got 404 as well.

So could anybody give me some suggestion that how can I get this? Many thanks!

Lang
  • 943
  • 13
  • 33
  • 1
    Are you including `projects/sub-proj01/src/assets` folder in the `angular.json` file in the `assets` section? By doing so, you should be able to access it like this `` – David Fontes Jul 25 '19 at 09:23
  • Hi David, yes, I generated my sub proj with the angular cli, it will auto generate the angular.json. – Lang Jul 25 '19 at 09:32
  • Actually, I just noticed, you are missing a slash before `assets/xxx.svg`, it should be `/assets/xxx.svg` assuming in your `index.html` you have your base at `"/"` – David Fontes Jul 25 '19 at 10:02
  • 1
    thank you! I did it in a work around way. I created a folder called sub-proj under the aggregator assets folder. I'm trying to make my project with microservice style, but it seems like it not so easy... – Lang Jul 25 '19 at 10:41
  • But appreciate if anybody knows a better solution to solve this problem. – Lang Jul 25 '19 at 10:43

1 Answers1

2

Go do angular.json file and in the array called "assets" you will put a object with "glob" that define what you wend copy, "input" that define the path of your subproject assets, and output" that is the final destine to copy everting.

 "assets": [
          "src/favicon.ico",
          "src/favicon.png",
          "src/assets",
          {
            "glob": "**/*", //COPY ALL THINGS
            "input": "projects/subproject-name/src/assets", //OF THIS DIRECTORY
            "output": "/assets/" //TO THIS DIRECTORE ROOT
          }
        ],