favicon not being deployed/displayed

C:\Users\Peter Ennis>ng version
angular-cli: 1.0.0-beta.14
node: 6.6.0
os: win32 x64

I have tried a number of options in the index.html file to get
the favicon showing but without success.

The localhost site and direct github link show the favicon.

The site is a masked redirect from godaddy to github gh-pages
using the ng github-pages:deploy

Some examples of favicon testing that fail, but have worked in the past
with other deploy methods:

<head>
  <meta charset="utf-8">
  <title>Adaept</title>
  <base href="/adaept/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="https://adaept.github.io/adaept/favicon.ico">
  <!-- <link rel="icon" sizes="16x16 32x32" href="favicon.ico?v=2">
       <link rel="icon" type="image/x-icon" href="favicon.ico"> -->

When I look in the dist folder and parent there is no favicon.ico file available to be deployed.

Does the file have to be manually copied? I would expect deploy to take care of this.

I had to put mine in the assets folder and change the path in the index.html

@ustaDAH

I could not find any assets folder in the system. Starting with new ...
Here: #713
is another reference from @ustaDAH

This also seems related: #2202

You have to create an assets folder in your src folder. By convention the CLI will copy it for you to /dist.

The webpack version of the CLI replaced the public folder for one named assets

@jbeckton

@jbeckton @peterennis yes that (creation of /src/assets) worked.

How do we find out if the team still wants to have the favicon.ico file copied during build?
It appears this might have been lost in Pull Request 2056

If it should still do this, I think the following will fix it...

In packages\angular-cli\models\webpack-build-common.ts update the plugins object to include a copy of the favicon.ico file:

      new CopyWebpackPlugin([
        {
          context: path.resolve(appRoot, appConfig.assets),
          from: { glob: '**/*', dot: true },
          ignore: [ '.gitkeep' ],
          to: path.resolve(projectRoot, appConfig.outDir, appConfig.assets)
        }, {
>>        from: path.resolve(projectRoot, appConfig.root, 'favicon.ico'),
>>        to: path.resolve(projectRoot, appConfig.outDir)
        }
      ])

If someone wants to do a pull request to fix this, please go ahead. There is too much overhead for me to follow the developers guidelines just for this simple fix. I don't have the time right now. Thanks!

Paul

This works! Thanks

Dupe of #2137

I'd be tempted to rather have favicon.ico in the assets folder and change the url in the index.html accordingly. (And of course also change ng new ... to generate seed sources as such).

It Works! Thanks!

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.}

Navigation Menu

Repository navigation

favicon not being deployed/displayed #2232

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

favicon not being deployed/displayed #2232

Description

Activity

jbeckton commented on Sep 19, 2016

peterennis commented on Sep 20, 2016

peterennis commented on Sep 20, 2016

jbeckton commented on Sep 20, 2016

ustaDAH commented on Sep 21, 2016

pauldubois777 commented on Sep 21, 2016

nmorado commented on Sep 21, 2016

filipesilva commented on Sep 22, 2016

ustaDAH commented on Sep 22, 2016

JScafidi616 commented on Feb 21, 2018

angular-automatic-lock-bot commented on Sep 7, 2019

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions