chunk.*.js contains all icons even though config/icons.js is present

[st-h]

Describe the bug
I have been tediously managing all used icons via the config/icons.js file. This has been working fine for years. However, I just noticed that there is a chunk.[random].js file being loaded within my app, which is very large. When looking at the content of the file, I noticed that it mostly - among a few other libraries I am using - seems to contain all font awesome icons - No matter if these icons are used in my app or not.

Expected behavior
Only FA icons that are present in config/icons.js should be present in production build output.

Desktop (please complete the following information):

• Version 0.4.1
• ember version: 4.9.1
• not yet switched to embroider

Additional context
I tried downgrading ember-source, ember-cli and fontawesome versions, but I could not find a version that would resolve the issue. Not sure what is causing this.
Any ideas how I can debug this?

[st-h]

This happens when importing an icon in a js file, like:

import { faCheckCircle } from '@fortawesome/pro-duotone-svg-icons';

Please feel free to close this issue, as this is a left over from the early days of ember-fontawesome. The README does no longer list importing icons in js files, so it likely won't be an issue for other users.

[jrjohnson]

I would guess this is caused by ember-auto-import because of the chunk.js output and honestly I'd expect it to just work. In fact one of the reasons I haven't done a lot of work here recently is I'm hoping that embroider plus the new <template> tag in .js files things means that importing icons the way you describe becomes the default and correct way and by importing one at a time we don't need to do any tree shaking in this addon. What happens if you change this to import faCheckCircle from '@fortawesome/pro-duotone-svg-icons/fa-check-circle' (I'm sort of guessing on the import semantics, but I wonder if accessing this single file instead of the entire list will fix the problem)

[st-h]

Thanks for the reply. Turns out that this was just an unnecessary leftover from a refactoring a long time ago. So I was able to simply remove it. However I would have never expected that this import would cause the whole fa package being shipped to the client. That’s why left the issue open. I just wish I have had a closer look to the file content instead of package analyzers, which did not show the issue. So many transferred bits waisted 🙈

[jrjohnson]

I agree this is an issue. What I'm in no way qualified to understand is if this is a problem with the way we do things in this addon, an issue with the way FA ships JS, or an issue in ember-auto-import. I'm not even sure where to start with that. If you want to take this further I'm happy to participate though! I just don't even know where to start so I'm going to go ahead and close this here as we don't document that icon strategy anymore.

[st-h]

I think it is ok to leave it as it is, given that importing icons in js is no longer documented. Probably tree shaking will take care of this issue. Otherwise I am not sure if there is an easy fix with the old way of building apps. Secondly I don’t see a good use case for importing icons in js files, other than trying to modify them at runtime - which again is questionable.