Better Error reporting if loaded vue has an issue

[dedanirungu]

Is your feature request related to a problem? Please describe. When errors happen on loaded vue3-sfc-loader there is no way to know the exact issue or line causing the issue.

Describe the solution you'd like I am loading multiple components dynamically to render my pages. I have a page called User.vue that loads the following sections, top.vue, search.vue, table-list.vue, and footer.vue. If an Issue happens on any of the loaded vue there is no way to tell the file causing it. The error shown reads:

runtime-core.esm-bundler.js:244 SyntaxError: Unexpected token (12:33) (at vue3-sfc-loader.js:13:179309)
    at $e._raise (vue3-sfc-loader.js:13:179309)
    at $e.raiseWithData (vue3-sfc-loader.js:13:179248)
    at $e.raise (vue3-sfc-loader.js:13:178704)
    at $e.unexpected (vue3-sfc-loader.js:13:198674)
    at $e.checkExpressionErrors (vue3-sfc-loader.js:13:199845)
    at $e.parseMaybeAssign (vue3-sfc-loader.js:13:209562)
    at vue3-sfc-loader.js:13:208690
    at $e.allowInAnd (vue3-sfc-loader.js:13:238585)
    at $e.parseMaybeAssignAllowIn (vue3-sfc-loader.js:13:208669)
    at $e.parseExprListItem (vue3-sfc-loader.js:13:234507)

Describe alternatives you've considered If the vue3-sfc-loader could catch the error and raise another highlighting the file causing the issue it would help.

[grcrozzo]

Same here, any idea how to get usable error text?

[FranckFreiburger]

Hi, do you pass a log function in the options ? ex.

    log(type, ...args) {

        console.log(type, ...args);
    },

If so, can you give me an example where error is not properly reported ?

[grcrozzo]

Hi, I finally solved it with the same code you sent, and it's good enough to debug, only SyntaxError: Unexpected token errors are hard to find, as dedanirungu has mentioned too. I got the same error, and I don't know what causes exactly the syntax error (e.q. ";" missing somewhere).

Anyway I very-very appreciate your work, I made a very complex CMS and online code development framework with version control system, and your sfc-loader has a huge part of it, so big thanks to you!

The only disadvantage is the speed performance, if you have any idea how to speed it up please give it some efforts. With some visual tricks I made our system to look a bit quicker, so it's not so bad, but a little speeding up would be great.

[FranckFreiburger]

Hi grcrozzo, thank you for your support ! Since this lib compiles code on the fly, client-side, I don't have many options for improving performance.

[grcrozzo]

Hi, you're welcome, I know you have much more work in it than that little paypal support.

Yeah, I know compiling on the fly will be always slower, anyway by time it will be faster automatically with newer and faster phones and notebooks, so I'm satisfied with it and with the visual tricks I made on loading and page navigation.

Great work man, I give compliment rarely, but you and the component are awesome!

[FranckFreiburger]

on second thought, the compiled version of the code may already be saved on a server using the async compiledCache API... the server would simply act as a simple key-value store (using LRU cache for instance).

[grcrozzo]

First thanks for thinking about our problems, it's very kind from you!

Well, I was thinking about it before, but as I mentioned, it's a very complex version control and publishing system either, so the time we could win with it we would lose on server side while generating page and component sources for different branches/versions. We make this dynamic generation in stored procedures from codes stored in SQL tables, and it's very hard to handle theses trees, so we would lose time there. Storing compiled versions seems obvious and a good idea, but could be hard to integrate into our system and our servers would use much more resources while serving the requests.

But as I mentioned it's not so slow, noone said that our system is slow, it's only a bit slow to me because I compare it to precompiled apps I made before, but none of our partners said that it's slow, all of them are pretty satisfied with it.

[grcrozzo]

Dear Franck,

first of all: I need some advice, but of course I don't expect it for free, if you have some idea I would be glad to pay for your help.

I can load a component from SFC, works well, but is there a way to export the loaded/compiled component to e.q. base64 string? I tried to save it with JSON.stringify(component), but functions (e.q. methods...etc.) are not exported, so it doesn't work.

My goal is to load and SFC, make the component with your loadModule function, save the result component to DB, and later in another page load I would load this saved (precompiled) component into the app (not the SFC). Is this possible? I would not save/compile the whole app, I need compiled version of a lot of components, and dynamically load some of them into the app in main.js.

Here is what I mean exactly, this should be saved and later loaded:

Please let me know if it's possible and if you could help with this, as I mentioned I would be glad to donate for your assistance.

Best regards,

Roland

[FranckFreiburger]

Hi Roland, I accept to give you assistance. Fell free to contact me at franck.freiburger@gmail.com or open a new topic in discussions if you prefer a public discussion.