Angular-cli: Files declared in .angular-cli "assets" are not copied

Created on 16 Jan 2018  Â·  37Comments  Â·  Source: angular/angular-cli

Versions

Angular CLI: 1.6.4
Node: 8.9.4
OS: win32 x64

Repro steps

My assets are defined as follows in .angular-cli.json (pretty much the default configuration):

"assets": [
  "assets",
  "favicon.png"
]

However, the files are not copied. Neither the assets folder, nor the favicon.
This only arises with @angular/[email protected]. With 1.6.3, everything works fine.

Mention any other details that might be useful (optional)

Can't really tell you anything else, as no errors or whatsoever are thrown during the build.
The declared assets are just missing in the output directory upon build completion.

blocked devkibuild-angular 1 (urgent) regression bufix

Most helpful comment

A half year past now + a major release of angluar and the issue still occurs? Are you kidding me? It can't be that complicated after all this worked a couple releases before.

All 37 comments

I have the same problem, even with 1.6.5.
All my styles, scss, stored under assets for but correctly imported from root style.scss aren’t available anymore using the —prod flag.

I am experiencing this behavior as well, seems to work okay on a Windows 10 box, but seeing the issue on a Windows Server 2008 R2 box, using 1.6.5, ng build --prod -verbose. The favicon.ico and assets folder are missing. Downgraded to 1.6.3 and that worked as expected.

I can't reproduce myself on my Windows 10 machine. @blovell33's report indicates it might be OS related.

@dgsqrs are you on windows as well? If so, what version? Is anyone using symlinks/junction or anything of the sort in their projects?

There was a commit related to asset copy (https://github.com/angular/angular-cli/commit/c7735ab8964bab38fa078ed28da775297b282533) merged between 1.6.3 and 1.6.4. This commit runs some extra processing on the path. Maybe it's related to the path used. @rbluethl @dgsqrs @blovell33 can you show me the full path for the assets folder in the system where it does not work?

/cc @clydin

C:\Program Files (x86)\Jenkins\{csharpprojectname}\bin\Release\www
System: Windows 10 Enterprise N

Thanks for looking into this.

I'm experiencing the same issue with version 1.6.5 and Windows 7 x64.

If I try downgrading to version 1.6.3 I get the following error after ng build --prod:

Error: Cannot find module '@angular-devkit/core'
    at Function.Module._resolveFilename (module.js:536:15)
    at Function.Module._load (module.js:466:25)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\PROJECTS\[examples]\PWA\pwa-ng5\node_modules\@angulardevkit\schematics\src\tree\virtual.js:10:16)
    at Module._compile (module.js:635:30)
    at Object.Module._extensions..js (module.js:646:10)
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)

Even after installing the package with npm i -D @angular-devkit/core, the ng build --prod command doesn't copy the assets folder either.

@enriquegarciagutierrez can you show me the full path for the assets folder in the system where it does not work?

@filipesilva I'm using Osx but I got the same problem using Ubuntu. I don't know what information I can give you, actually. I did a ng serve and it worked. ng serve --prod does not work and I just saw that the scss are missing, but only those from my assets folder. I have no error, nowhere.

Hi @filipesilva

The folder is currently located in C:\PROJECTS\[examples]\PWA\pwa-ng5\src\assets.

I tried creating the project again in C:\pwa-ng5 with version 1.6.5 and surprisingly it's copying favicon.ico but not the assets folder with this configuration in .angular-cli.json:

"apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": [
        "assets",
        "favicon.ico"
      ],

Edit: Never mind, it wasn't copying because there was no content inside assets folder. As soon as I copied some files inside it worked like a charm!

So maybe it has to be with the folder path containing weird characters such as []?

@filipesilva This issue does not existing using 1.7.0-beta.1 (but I have others)

@rbluethl @blovell33 @enriquegarciagutierrez can you try using 1.7.0-beta.1 please?

Hi @filipesilva

Same result using 1.7.0-beta.1:

  • Copies everything to dist if root directory is C:\pwa-ng5\src
  • It doesn't copy anything if root directory is C:\PROJECTS\[examples]\PWA\pwa-ng5\src

Edit: tried renaming [examples] folder to examples and everything works now. Another colleague was having the same issue because she had a . in a folder name (C:\Users\name.lastname\Documents\Projects).

Seems to be something related to certain symbols on folder names.

Late seeing this...

Path where it works.
D:\dev\connect\src\Websites\Accounts\Client\src\assets

Path where it does not work.
C:\Program Files (x86)\Jenkins\workspace\(Test) Connect\src\Websites\Accounts\Client\src\assets

I will try later today with with 1.7.0-beta.1

Maybe an issue with special characters in path, I can copy folder to different location and test.

We've narrowed it down to special characters, yeah. Sorry about that. @clydin is working on a PR in https://github.com/webpack-contrib/copy-webpack-plugin/pull/208 to fix all cases.

BTW for now a workaround is to use a path without special characters.

I'm also facing same issue while upgrading angular cli from 1.6.6 to 1.6.7.
I have 4-5 different projects and none of them is including assets folder in any(production or dev) build. and can not access it on dev server using ng serve.

Update:
I solved it by removing spaces, brackets and folder name coming in path
D:\Projects\a b c\4. Button(new) is now D:\Projects\vinzentEllissenGermany\4.ButtonNew

I went from 1.6.3 to 1.6.7 and I am having a similar issue. My assets and favicon are not included. The build is done on jenkins:
C:\Program Files (x86)\Jenkins\jobs\mamon\workspace>ng build

Can report this is an issue for "@angular/cli": "1.4.3" as well, have been using the following all along.

  "assets": [
    "assets",
    "favicon.ico"
  ],

build string
ng build --output-path ..\ngbuild --verbose --target=production --environment=server --aot
Project path
C:\Program Files (x86)\Jenkins\jobs\Travel_Html5\workspace\RIWebUI

I was having the same problem, and I went ahead an ejected the webpack configuration to see if anything was going on in there.

I found a problem with the CopyWebpackPlugin in the plugins section that is apparently generated from angular-cli assets section.

In the code below I changed what was originally generated so that the from glob didn't contains the path in the context property. Once I did that assets loaded correctly.

new CopyWebpackPlugin([
  {
    "context": "src",
    "to": "",
    "from": {
      "glob": "src\\assets\\**\\*",
      "dot": true
    }
  },
  {
    "context": "src",
    "to": "",
    "from": {
      "glob": "src\\favicon.ico",
      "dot": true
    }
  }
]);

This works:

new CopyWebpackPlugin([
  {
    "context": "src",
    "to": "",
    "from": {
      "glob": "assets\\**\\*",
      "dot": true
    }
  },
  {
    "context": "src",
    "to": "",
    "from": {
      "glob": "favicon.ico",
      "dot": true
    }
  }
]);

Hi.
Still the same. Assert folder isn't copied.

@angular/cli - 1.7.0
Project folder is: C:\Test (test)\

ejected webpack config:

new CopyWebpackPlugin([
{
"context": "src",
"to": "",
"from": {
"glob": "assets\*\",
"dot": true
}
},

copy-webpack-plugin debug output:

[copy-webpack-plugin] processing from: '[object Object]' to: ''
[copy-webpack-plugin] determined '' is a 'dir'
[copy-webpack-plugin] begin globbing 'C:/Test \(test\)\src/assets\*\' with a context of 'C:\Test (test)\src'

I am also having the same issue still after upgrading to 1.7.0. Running from a Jenkins build process on windows Server 2012 R2. The build folder was under /Program Files (x86). However I moved the build folder to a different directory with no parenthesis and that did fix the problem as @filipesilva indicated.

issue with angular cli

new CopyWebpackPlugin([
{
"context": "src",
"to": "",
"from": {
"glob": "C:\Users\mrjohn\Desktop\new \folder \7\testing2\src\assets\*\",
"dot": true
}

should be
"glob": "C:\Users\mrjohn\Desktop\new folder 7\testing2\src\assets\*\",

I am able to replicate this issue with Angular-CLI 1.7.2 on Jenkins running on a windows box. It does seems that special characters is the issue.

got the same problem when i upgraded CLI from 1.6.7 to 1.7.3. downgrading to 1.6.7 fixed it.
and btw when i use the ng serve command in 1.7.3 , it says to open browser on http://localhost:4200/assets, instead of http://localhost:4200/ , not sure related to this issue, but it's fine in version 1.6.7

Can confirm that folders with '(' and ')' (like any Dropbox folder) cause the assets not to be included in serve nor build.

I have the same problem with Jenkins with angular cli 1.6-1.7. I have a project with cli 1.5.5 without problems. Jenkins has a workspace folder C:\Program Files (x86)\Jenkins\workspace. I changed it to C:\jenkinsworkspace and the problem is gone. So problem is in 'Program Files (x86)'

Yea, problem is any directory with parenthesis

Juhana Lehtiniemi
www.juhanalehtiniemi.com
+358 50 3022308

Oleg Sulima notifications@github.com kirjoitti 7.4.2018 kello 17.30:

I have the same problem with Jenkins with angular cli 1.6-1.7. I have a project with cli 1.5.5 without problems. Jenkins has a workspace folder C:\Program Files (x86)\Jenkins\workspace. I changed it to C:\jenkinsworkspace and the problem is gone. So problem is in 'Program Files (x86)'

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.

Is this issue fixed in angular-cli 1.7.4 ? I have the same issue , changing jenkins path will be difficult for me as there are many dependent jobs.

@sri7vasu we had the issue at work with Jenkins where we couldn't just willy nilly change the path - my "fix" was to create an extra task to run after building the project, that copies our assets manually. Very bandaid, so hopefully this will get resolved soon (maybe with the release of 6.0?)

still an issue in 6.0.2

still an issue @6.0.3

  • ng serve/ng build doesn't deploy asset folder (e.g. the project is under D:__(test)\testproject) [X]
  • ng build deploys asset folder (e.g. the project is under D:\testproject)

As already mentioned: The angular-cli can't handle parenthesis ( '(' and ')' ) in directories correctly.

On my localhost I'm running:
Node: 8.11.1
Npm: 5.6.0
Angular CLI: 6.0.0
OS: win32 x64
Angular: 5.2.10

On Jenkins (CI) server:
Node: 8.11.2
Npm: 5.6.0
Angular CLI: 6.0.0
OS: win32 x64
Angular: 5.2.10

On my localhost it includes the assets, but not on Jenkins. The only difference is the NodeJS Version. Hope that helps to identify issue a little closer

It looks like the tracking issue for this problem in the webpack plugin we use is https://github.com/webpack-contrib/copy-webpack-plugin/issues/231. There seems to be a fix on the way as well: https://github.com/webpack-contrib/copy-webpack-plugin/pull/264

I was investigating this issue on our Jenkins server and then find out that the issue is the workspace folder contains a space character. If moved to the location where the full path didn't contain any spaces, it compiled properly. Mea culpa, should've checked earlier.

A half year past now + a major release of angluar and the issue still occurs? Are you kidding me? It can't be that complicated after all this worked a couple releases before.

This may be related. Currently, I am using to 6.0.7 I have multiple projects in a workspace.
I also have ane empty assets folder.

So my assets read like this:

            "assets": [
              "projects/pname/src/favicon.ico",
              "projects/pname/src/assets"
            ]

If I add web.config to the list like this it won't copy.

            "assets": [
              "projects/pname/src/favicon.ico",
              "projects/pname/src/assets",
              "projects/pname/src/web.config"
            ]

If I add web.config before the assets folder it copies as expected.

            "assets": [
              "projects/pname/src/favicon.ico",
              "projects/pname/src/web.config",
              "projects/pname/src/assets"
            ]

@filipesilva
Since there has been a new release of the plugin which includes the fix https://github.com/webpack-contrib/copy-webpack-plugin/pull/264, do you plan to include this in 6.1.x?

Since the fix is now in copy-webpack-plugin and released, some users should get it straight away. You can force your npm lockfile to use it by doing this:

npm install [email protected] --save-dev
npm uninstall [email protected] --save-dev

This should force your lockfile to recognize the new version and use it inside @angular-devkit/build-angular. Don't forget to uninstall it right after though (the second step), otherwise you can end up with duplicated versions.

I also put up https://github.com/angular/angular-cli/pull/11437 which bumps our minimum version. It should go in sometime in the 6.1.x life time.

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings

Related issues

IngvarKofoed picture IngvarKofoed  Â·  3Comments

JanStureNielsen picture JanStureNielsen  Â·  3Comments

hartjo picture hartjo  Â·  3Comments

donaldallen picture donaldallen  Â·  3Comments

MateenKadwaikar picture MateenKadwaikar  Â·  3Comments