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

refactor(frontend): Migrate the frontend application from Vue.js 2 to 3 #2119

Merged
merged 29 commits into from Feb 4, 2024

Conversation

Azurewarth0920
Copy link
Contributor

Description

EOF of Vue.js 2 is at the end of this year, so I tried to migrate to Vue 3.

  • Updated library and rewrote the frontend application with Vue 3 syntax.
  • The project uses the UI library @vue/ui and seems not under maintenance, moves the components here and rewrites them with composition API.
  • The tests are broken so I manually packaged it and tested it with my project, and it seems to work well.

Additional context

The PR has huge diffs and may be hard to review, and I try to separate each migration item into commits,
so that reviewing commit by commit is easier to read. Can you take a look at this? @Akryum


What is the purpose of this pull request?

  • Bug fix
  • New Feature
  • Documentation update
  • Other

Before submitting the PR, please make sure you do the following

  • Read the Contributing Guidelines.
  • Read the Pull Request Guidelines and follow the Commit Convention.
  • Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
  • Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).

@Akryum
Copy link
Member

Akryum commented Dec 15, 2023

👀

@Akryum
Copy link
Member

Akryum commented Feb 4, 2024

Thank you very much! 🙏

@Akryum Akryum changed the title chore(frontend): Migrate the frontend application from Vue.js 2 to 3 refactor(frontend): Migrate the frontend application from Vue.js 2 to 3 Feb 4, 2024
@Akryum Akryum merged commit 9238638 into vuejs:main Feb 4, 2024
3 of 5 checks passed
let spriteIndex = 0
// Load all the SVG symbols
icons.keys().forEach((key, index) => {
let result = icons(key)
Copy link

Choose a reason for hiding this comment

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

Hi!

This code is return a base64 encoded content with the string "module.exports = ....", I guess is normal because we are using require.context.

So, at the end is reporting errors all code at line 15 because the regular expresions will return a null (then cannot be destruct from null).

I tested with a code like:

      const base64Prefix = 'data:image/svg+xml;base64,'
      if (result.startsWith(base64Prefix)) {
        const positionPrefix = result.indexOf(base64Prefix) + base64Prefix.length
        const base64Content = result.substring(positionPrefix)
        result = atob(base64Content)
        const regex = /module.exports = (.*)/.exec(result)
        result = JSON.parse(regex[1])
      }

before using the regular expression.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants