How to use node-grpc with Quasar?

[Astesia]

how to use node-grpc with Quasar like https://grpc.io/docs/languages/node/quickstart/?
I try to use grpc in Quasar, but it may have many bugs.
For example, the method “loadSync” of “@grpc/proto-loader” tell me not supported when I run it in Quasar.
Then, I find its reason that is the util.fs is null. Ok, I write the base64 string of my proto file and replace the file read code. (This is just a temporary solution)
After that, I’m desperate, because I find that require(‘grpc’) is equal to null. I double-check my npm list and ensure the grpc package is exists, but it still doesn’t work.
I will never use the grpc-web because this project is for the Windows desktop app, and please don’t tell me to use C#, I like C# but I hate WPF. I hate XAML.
The most reason why I hope to use Quasar is that I don’t want to spend any energy on art and layout, and I also don’t want my app to become ugly like the default WinForms GUI.
So, I hope to use grpc on Quasar, and who can help me?

this is the code:

<template>
  <q-page class="flex flex-center">
    <img
      alt="Quasar logo"
      src="~assets/quasar-logo-full.svg"
    >
    <q-btn label="Alert" color="primary" @click="test" />
  </q-page>
</template>

<script>
export default {
  name: 'PageIndex',
  methods: {
    test () {
      console.log('test!')
      var PROTO_PATH = 'xxxx/yyyy.proto'
      var grpc = require('grpc')
      var protoLoader = require('@grpc/proto-loader')
      const options = {
        keepCase: true,
        longs: String,
        enums: String,
        defaults: true,
        oneofs: true
      }
      var packageDefinition = protoLoader.loadSync(PROTO_PATH, options)
      console.log('loadSync')
      var grpcCore = grpc.loadPackageDefinition(packageDefinition).Core
      console.log('Load Grpc proto')
      var client = new grpcCore.Core('localhost:50051', grpc.credentials.createInsecure())
      client.getResolution(
        { path: '' },
        function (err, response) {
          if (err) {
            console.log(err)
          }
          console.log('width:', response.width, 'height:', response.height)
        })
    }
  }
}
</script>

[dobbel]

@Astesia

Here’s a vue tutorial:
https://dev.to/thearavind/a-todo-app-using-grpc-web-and-vuejs-3p55

Also remember that Quasar is a front end framework only that runs in the clients browser. Node.js and C# run server side.

Also found this vue libary:
https://github.com/b3ntly/vue-grpc

And this Quasar grpc demo:
https://github.com/gustavohenrique/grpc-web-golang-vuejs