Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: add typescript #4

Open
wants to merge 8 commits into
base: master
Choose a base branch
from
Open

feat: add typescript #4

wants to merge 8 commits into from

Conversation

HybridFox
Copy link

I shuffled some folders around to make them easier work with typescript, ts-loader & webpack.
Apart from that the only thing i did was add typescript and updated extensions

Pieterjan Van Saet and others added 8 commits June 12, 2020 20:24
feat: add typescript
383a916
@tarunmangukiya
fix: Added CSS for alignment Iconscout#3
0f6f200
@tarunmangukiya
fix: ClassName inherit from parent
1482d24
@tarunmangukiya
fix: Version updated to 0.0.3
1285233
feat: add typescript
6379708
chore: update build script
ce6f092
feat(webpack): update loaders
b8f9258
Merge branch 'master' into feature/add-typescript
d1f8d78 
# Conflicts:
#	commands/generate.js
#	icons/uim-500px.js
#	icons/uim-adobe-alt.js
#	icons/uim-adobe.js
#	icons/uim-airplay.js
#	icons/uim-align-alt.js
#	icons/uim-align-center-justify.js
#	icons/uim-align-center.js
#	icons/uim-align-justify.js
#	icons/uim-align-left-justify.js
#	icons/uim-align-left.js
#	icons/uim-align-letter-right.js
#	icons/uim-align-right-justify.js
#	icons/uim-align-right.js
#	icons/uim-align.js
#	icons/uim-amazon.js
#	icons/uim-analysis.js
#	icons/uim-analytics.js
#	icons/uim-anchor.js
#	icons/uim-android-alt.js
#	icons/uim-android.js
#	icons/uim-angle-double-down.js
#	icons/uim-angle-double-left.js
#	icons/uim-angle-double-right.js
#	icons/uim-angle-double-up.js
#	icons/uim-angle-down.js
#	icons/uim-angle-left.js
#	icons/uim-angle-right-b.js
#	icons/uim-angle-right.js
#	icons/uim-angle-up.js
#	icons/uim-apple-alt.js
#	icons/uim-apple.js
#	icons/uim-apps.js
#	icons/uim-arrow-circle-down.js
#	icons/uim-arrow-circle-left.js
#	icons/uim-arrow-circle-right.js
#	icons/uim-arrow-circle-up.js
#	icons/uim-arrow-down-left.js
#	icons/uim-arrow-down-right.js
#	icons/uim-arrow-up-left.js
#	icons/uim-arrow-up-right.js
#	icons/uim-at.js
#	icons/uim-bag.js
#	icons/uim-bars.js
#	icons/uim-battery-bolt.js
#	icons/uim-battery-empty.js
#	icons/uim-behance-alt.js
#	icons/uim-behance.js
#	icons/uim-bing.js
#	icons/uim-bitcoin-alt.js
#	icons/uim-bitcoin.js
#	icons/uim-blackberry.js
#	icons/uim-blogger-alt.js
#	icons/uim-blogger.js
#	icons/uim-bookmark.js
#	icons/uim-border-alt.js
#	icons/uim-border-bottom.js
#	icons/uim-border-clear.js
#	icons/uim-border-horizontal.js
#	icons/uim-border-inner.js
#	icons/uim-border-left.js
#	icons/uim-border-out.js
#	icons/uim-border-right.js
#	icons/uim-border-top.js
#	icons/uim-border-vertical.js
#	icons/uim-box.js
#	icons/uim-briefcase.js
#	icons/uim-calender.js
#	icons/uim-chart-pie.js
#	icons/uim-chart.js
#	icons/uim-check-circle.js
#	icons/uim-check-square.js
#	icons/uim-check.js
#	icons/uim-circle-layer.js
#	icons/uim-circle.js
#	icons/uim-clinic-medical.js
#	icons/uim-clock-eight.js
#	icons/uim-clock-five.js
#	icons/uim-clock-nine.js
#	icons/uim-clock-seven.js
#	icons/uim-clock-ten.js
#	icons/uim-clock-three.js
#	icons/uim-clock-two.js
#	icons/uim-clock.js
#	icons/uim-columns.js
#	icons/uim-comment-alt-dots.js
#	icons/uim-comment-alt-message.js
#	icons/uim-comment-alt-plus.js
#	icons/uim-comment-alt.js
#	icons/uim-comment-dots.js
#	icons/uim-comment-message.js
#	icons/uim-comment-plus.js
#	icons/uim-comment.js
#	icons/uim-compress.js
#	icons/uim-corner-down-left.js
#	icons/uim-corner-down-right.js
#	icons/uim-corner-left-down.js
#	icons/uim-corner-right-down.js
#	icons/uim-corner-up-left.js
#	icons/uim-corner-up-right.js
#	icons/uim-coronavirus.js
#	icons/uim-css3-simple.js
#	icons/uim-css3.js
#	icons/uim-cube.js
#	icons/uim-dialpad-alt.js
#	icons/uim-dialpad.js
#	icons/uim-direction.js
#	icons/uim-discord.js
#	icons/uim-document-layout-center.js
#	icons/uim-document-layout-left.js
#	icons/uim-document-layout-right.js
#	icons/uim-download-alt.js
#	icons/uim-dribbble.js
#	icons/uim-dropbox.js
#	icons/uim-ellipsis-h.js
#	icons/uim-ellipsis-v.js
#	icons/uim-exclamation-circle.js
#	icons/uim-exclamation-octagon.js
#	icons/uim-exclamation-triangle.js
#	icons/uim-facebook-f.js
#	icons/uim-facebook-messenger-alt.js
#	icons/uim-facebook-messenger.js
#	icons/uim-facebook.js
#	icons/uim-favorite.js
#	icons/uim-flip-h-alt.js
#	icons/uim-flip-h.js
#	icons/uim-flip-v-alt.js
#	icons/uim-flip-v.js
#	icons/uim-github-alt.js
#	icons/uim-github.js
#	icons/uim-google-drive-alt.js
#	icons/uim-google-drive.js
#	icons/uim-google-hangouts-alt.js
#	icons/uim-google-hangouts.js
#	icons/uim-google-play.js
#	icons/uim-google.js
#	icons/uim-graph-bar.js
#	icons/uim-grid.js
#	icons/uim-grids.js
#	icons/uim-grip-horizontal-line.js
#	icons/uim-head-side-cough.js
#	icons/uim-head-side-mask.js
#	icons/uim-head-side.js
#	icons/uim-history-alt.js
#	icons/uim-history.js
#	icons/uim-horizontal-align-left.js
#	icons/uim-hospital-square-sign.js
#	icons/uim-hospital-symbol.js
#	icons/uim-hospital.js
#	icons/uim-house-user.js
#	icons/uim-html3-alt.js
#	icons/uim-html3.js
#	icons/uim-html5-alt.js
#	icons/uim-html5.js
#	icons/uim-image-v.js
#	icons/uim-instagram-alt.js
#	icons/uim-instagram.js
#	icons/uim-intercom-alt.js
#	icons/uim-intercom.js
#	icons/uim-java-script.js
#	icons/uim-key-skeleton-alt.js
#	icons/uim-key-skeleton.js
#	icons/uim-keyhole-circle.js
#	icons/uim-keyhole-square-full.js
#	icons/uim-keyhole-square.js
#	icons/uim-layer-group.js
#	icons/uim-layers-alt.js
#	icons/uim-left-indent-alt.js
#	icons/uim-left-indent.js
#	icons/uim-line-spacing.js
#	icons/uim-line.js
#	icons/uim-link-h.js
#	icons/uim-linkedin-alt.js
#	icons/uim-linkedin.js
#	icons/uim-list-ui-alt.js
#	icons/uim-list-ul.js
#	icons/uim-lock-access.js
#	icons/uim-lock-alt.js
#	icons/uim-lock-open-alt.js
#	icons/uim-lock.js
#	icons/uim-master-card.js
#	icons/uim-medium-m.js
#	icons/uim-microscope.js
#	icons/uim-minus-square-full.js
#	icons/uim-multiply.js
#	icons/uim-object-group.js
#	icons/uim-object-ungroup.js
#	icons/uim-opera-alt.js
#	icons/uim-opera.js
#	icons/uim-padlock.js
#	icons/uim-paperclip.js
#	icons/uim-paragraph.js
#	icons/uim-paypal.js
#	icons/uim-pentagon.js
#	icons/uim-plus-square.js
#	icons/uim-polygon.js
#	icons/uim-previous.js
#	icons/uim-process.js
#	icons/uim-react.js
#	icons/uim-record-audio.js
#	icons/uim-reddit-alien-alt.js
#	icons/uim-redo.js
#	icons/uim-refresh.js
#	icons/uim-repeat.js
#	icons/uim-right-indent-alt.js
#	icons/uim-rocket.js
#	icons/uim-ruler-combined.js
#	icons/uim-ruler.js
#	icons/uim-sanitizer-alt.js
#	icons/uim-sanitizer.js
#	icons/uim-scenery.js
#	icons/uim-schedule.js
#	icons/uim-shield-plus.js
#	icons/uim-sign-in-alt.js
#	icons/uim-sign-out-alt.js
#	icons/uim-signal-alt-3.js
#	icons/uim-signal-alt.js
#	icons/uim-signin.js
#	icons/uim-signout.js
#	icons/uim-skype-alt.js
#	icons/uim-skype.js
#	icons/uim-slack-alt.js
#	icons/uim-slack.js
#	icons/uim-snapchat-alt.js
#	icons/uim-snapchat-ghost.js
#	icons/uim-snapchat-square.js
#	icons/uim-social-distancing.js
#	icons/uim-sorting.js
#	icons/uim-space-key.js
#	icons/uim-square-full.js
#	icons/uim-square.js
#	icons/uim-squre-shape.js
#	icons/uim-star-half-alt.js
#	icons/uim-star.js
#	icons/uim-step-forward.js
#	icons/uim-stethoscope-alt.js
#	icons/uim-stethoscope.js
#	icons/uim-store-slash.js
#	icons/uim-subject.js
#	icons/uim-swiggy.js
#	icons/uim-sync-exclamation.js
#	icons/uim-sync-slash.js
#	icons/uim-table.js
#	icons/uim-telegram-alt.js
#	icons/uim-telegram.js
#	icons/uim-th-large.js
#	icons/uim-times-circle.js
#	icons/uim-toggle-off.js
#	icons/uim-toggle-on.js
#	icons/uim-toilet-paper.js
#	icons/uim-triangle.js
#	icons/uim-tumblr-alt.js
#	icons/uim-tumblr-square.js
#	icons/uim-tumblr.js
#	icons/uim-twitter-alt.js
#	icons/uim-twitter.js
#	icons/uim-unlock-alt.js
#	icons/uim-unlock.js
#	icons/uim-upload-alt.js
#	icons/uim-user-arrows.js
#	icons/uim-user-md.js
#	icons/uim-user-nurse.js
#	icons/uim-vector-square-alt.js
#	icons/uim-vector-square.js
#	icons/uim-virus-slash.js
#	icons/uim-visual-studio.js
#	icons/uim-vk-alt.js
#	icons/uim-vk.js
#	icons/uim-vuejs-alt.js
#	icons/uim-vuejs.js
#	icons/uim-web-grid-alt.js
#	icons/uim-web-grid.js
#	icons/uim-web-section-alt.js
#	icons/uim-web-section.js
#	icons/uim-whatsapp.js
#	icons/uim-window-grid.js
#	icons/uim-window-maximize.js
#	icons/uim-window-section.js
#	icons/uim-wordpress-simple.js
#	icons/uim-wordpress.js
#	icons/uim-wrap-text.js
#	icons/uim-youtube.js
#	package.json
@tarunmangukiya
Copy link
Contributor

Hi @HybridFox, Thanks for the PR!

I am not that much into Typescript. Can you tell me how does it work in create-react-app with JavaScript?

@HybridFox
Copy link
Author

Hey Tarun, this would work completely the same in a normal CRA scenario since there is still the .bundle file.
The only thing we provide extra are .d.ts files.
Typescript is able to interpret these files and show types. Normal javascript would just ignore these files

@tarunmangukiya
Copy link
Contributor

Thanks for your clarification. I've some points in my mind:

  • We should keep directory structure as it is, as we're following the standard directory structure across all the projects. Check this repo: https://github.com/iconscout/react-unicons
  • There's still module key in package.json but the file is not being generated now.
  • As we're now using webpack tree-shaking, we don't need to import icons individually, right?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@HybridFox @tarunmangukiya