FazBrowse GitHub Viewer | Trending |
URL:
| Home
Tools: [Download Repo ZIP]   [Original HTTPS Page]

Use transform imports plugin on react-icons for all pf4 builds. by Hyperkid123 · Pull Request #3476 · patternfly/patternfly-react · GitHub

Use transform imports plugin on react-icons for all pf4 builds. - #3476

Closed
Hyperkid123 wants to merge 1 commit into
patternfly:masterfrom
Hyperkid123:apply-transform-import-plugin-pf4
Closed

Use transform imports plugin on react-icons for all pf4 builds.#3476
Hyperkid123 wants to merge 1 commit into
patternfly:masterfrom
Hyperkid123:apply-transform-import-plugin-pf4

Conversation

Hyperkid123 commented Jan 9, 2020
edited
Loading

Copy link
Copy Markdown
Contributor

What: Adress #3448 and #3155

Changes build paths to icons to use direct paths instead of using icons from index.js

Hyperkid123 commented Jan 9, 2020
edited
Loading

Copy link
Copy Markdown
Contributor Author

cc @karelhala @evwilkin

Copy link
Copy Markdown
Collaborator

PatternFly-React preview: https://patternfly-react-pr-3476.surge.sh

codecov-io commented Jan 9, 2020
edited
Loading

Copy link
Copy Markdown

Codecov Report

Merging #3476 into master will not change coverage.
The diff coverage is n/a.

@@          Coverage Diff           @@
##           master   #3476   +/-   ##
======================================
  Coverage    67.1%   67.1%           
======================================
  Files         903     903           
  Lines       25483   25483           
  Branches     2254    2254           
======================================
  Hits        17100   17100           
  Misses       7342    7342           
  Partials     1041    1041
Flag Coverage Δ
#misc 95.45% <ø> (ø) ⬆️
#patternfly3 69.29% <ø> (ø) ⬆️
#patternfly4 64.21% <ø> (ø) ⬆️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update ff8f2ff...999464a. Read the comment docs.

karelhala left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Choose a reason Spam Abuse Off Topic Outdated Duplicate Resolved Low Quality

Looking good! Just bear in mind that you have to actually open the babel.config.js file in patternfly-4 folder, otherwise you won't see the full changes. Don't know why GitHub shows only part of it...

evwilkin left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Choose a reason Spam Abuse Off Topic Outdated Duplicate Resolved Low Quality

LGTM

evwilkin left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Choose a reason Spam Abuse Off Topic Outdated Duplicate Resolved Low Quality

LGTM

redallen left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Choose a reason Spam Abuse Off Topic Outdated Duplicate Resolved Low Quality

I'm working on an implementation to change all the instances of import { SomeIcon } from '@patternfly/react-icons'; to import SomeIcon from '@patternfly/react-icons/dist/js/SomeIcon; in all patternfly-4/*.{tsx,js} files. There's 60 occurrences which isn't too bad. Once I have the PR ready I'll link it here and you can let me know if it works.

"@babel/proposal-class-properties",
"@babel/proposal-object-rest-spread",
]
}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Choose a reason Spam Abuse Off Topic Outdated Duplicate Resolved Low Quality

Why couldn't you have just renamed this to babel.config.js and added your plugin here? That would apply it to all the pf4 builds. I worked hard to unify our babel config and get away from BABEL_ENV=cjs or whatnot so that Windows works without having to use yet another tool called cross-env.

Soon I'm planning on removing babel in pf4 in favor of tsc, which we're already using for typechecking, so I'm also not really a fan of adding this plugin to begin with. Could we just change all the instances of import { SomeIcon } from '@patternfly/react-icons'; to import { SomeIcon } from '@patternfly/react-icons/dist/js/SomeIcon in all patternfly-4/*.{tsx,js} files? There's only about 50 or so. We could easily add a linting step that gets upset if we try to use ESM imports like import { SomeIcon } from '@patternfly/react-icons';.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Choose a reason Spam Abuse Off Topic Outdated Duplicate Resolved Low Quality

If you are planing the direct imports that would be perfect and we can close this. I would prefer that anyway so you don't have to rely on some plugin.

I did not want to do any changes to the component code.

I would like to point out that the same thing should be done with react-core components in extensions like react-table.

Copy link
Copy Markdown
Contributor

Does #3517 work for you @Hyperkid123 ?

Copy link
Copy Markdown
Contributor Author

@redallen works. But I've noticed that you have marked #3155 as resolved. I think it could be closed after all extensions use direct imports not only for react-icons but for react-core as well.

If you have your hands full I can start working on that.

Copy link
Copy Markdown
Contributor

I updated #3517 to just say "towards #3155".

I do currently have my hands full, so working on that would be appreciated and help reduce CJS bundle sizes further.

Copy link
Copy Markdown
Contributor Author

Ok, I will start the changes ASAP. I think this can be closed in favor of your PR.

Hyperkid123 deleted the apply-transform-import-plugin-pf4 branch January 17, 2020 07:56
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

7 participants


Back | FazBrowse Home | New Git URL