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.

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

migrate from lit-html to vue components #300

Open
amk-dev opened this issue Jul 4, 2024 · 5 comments · May be fixed by #304
Open

migrate from lit-html to vue components #300

amk-dev opened this issue Jul 4, 2024 · 5 comments · May be fixed by #304
Assignees
Labels
fosshack Reserved for FOSS Hack Partner Projects Programme

Comments

@amk-dev
Copy link
Collaborator

amk-dev commented Jul 4, 2024

Currently hoppscotch extension uses lit-html to write the UI part of it. but we are planning to migrate it to vue. to make it more easier to work with and to follow the general stack used over hoppscotch.

@amk-dev amk-dev added the fosshack Reserved for FOSS Hack Partner Projects Programme label Jul 4, 2024
@The-x-35
Copy link

I would like to work on this issue under foss hack.
Can I be assigned for this?
I have a little experience working with vue previously.

@amk-dev
Copy link
Collaborator Author

amk-dev commented Jul 12, 2024

Hey @The-x-35

you can work on this. can you write up a brief doc ( add as a reply to this ) on how you're going to tackle this. you'll also want to look into #301. both of these issues goes hand in hand.

@The-x-35
Copy link

Hi @amk-dev
I saw #301 and here is the brief doc on how will i solve both #300 and #301 .
For #300

  • Identify the parts of the project using lit-html.
  • For each lit-html component, Create a corresponding Vue component.
  • Ensure the functionality remains the same.
  • Verify that the new Vue components are functioning correctly.

For #301
1st approach: Replace the build and bundling tool Parcel with Vite.
2nd approach: Instead of changing the build script with vite and making it difficult, because I may miss some script or path, I would just create a simple project in vite and recreate all the components of this project in that by copy pasting.

Please guide if I should mend the plan anyway.
Also can you please guide me on how to setup the development environment, I could build the project by following the instructions but couldn't find instructions for the dev environment, would I have to build it each time?

@amk-dev
Copy link
Collaborator Author

amk-dev commented Jul 16, 2024

Hey,
you can proceed with your plans. we'll iterate on the output if needed. I would lean towards replacing the parcel bits piece by piece. there are places where we use parcel specific features, you'll have to figure out the equivalents on vite. if you need any help please feel free to comment here.

Also can you please guide me on how to setup the development environment, I could build the project by following the instructions but couldn't find instructions for the dev environment, would I have to build it each time?

yes. make changes -> reload the extension from the browser will be the workflow.

@The-x-35
Copy link

The-x-35 commented Jul 22, 2024

Hi @amk-dev sir,
I solved this issue. I replaced popup-script.ts with a .vue file and reimplemented all the functionalities and designs exactly in vue. I have tested it and it works same as before.
Is this approach correct?
About the issue #301 , I am not sure how to proceed with that and what all files to change, if you could guide me a little and assign that issue to me, I would be grateful.

@The-x-35 The-x-35 linked a pull request Jul 27, 2024 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
fosshack Reserved for FOSS Hack Partner Projects Programme
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants