Hot Reload not working

My production build runs perfect but the hot reload gives error in login. What other settings are required for hot reload of vue js project apart from ‘npm run serve’ ? PLease find the screen shot for your reference.

How is it related to Storj?
If it’s storj-up or storj-sim test networks, then you can increase a timeout in the account setting. And this timeout should not logout you if you currently uploading or downloading via objects browser.
However I would suggest to use some tools like Cyberduck, FileZilla, rclone instead of web UI to upload/download your files.

If it’s your own site then you perhaps should better know, what’s timeouts are you using and how to increase them.

1 Like

+1 for Cyberduck / Mountain Duck

When I try to run the hot reload using ‘npm run dev’, it gives me attached scripting error. It will great if someone has a solution to this.

Could you please add more details? What’s repo, in which folder you are trying to run in, what do you want to achieve?

I want to run the web project located at storj/web/satellite. but it is not running. Giving scripting error ‘The requested module ‘/node_modules/.vite/deps/vue.js?v=4008b62a’ does not provide an export named ‘Component’ (at GalleryView.vue:115:10)’.

Have used the repository GitHub - storj/storj: Ongoing Storj v3 development. Decentralized cloud object storage that is affordable, easy to use, private, and secure.

You should run it differently: https://github.com/storj/storj/tree/main/web/satellite#compiles-and-hot-reloads-for-development

Dear Alexey,

It shows ‘npm run serve’ but the same is not there in package.json. Moreover, there is ‘npm run dev’ in package.json, in which I am getting this error. Somehow, not able to run the project due to this in hot reload.

As far as I know, it’s a part of the satellite, so usually you need only to build it with

npm install
npm run build

I’m not sure that it can work as a separate project without a backend.
I forwarded your request to the team, so I hope they can help.

But did you try to run it with npm run serve?

I have already started the test network and satellite server. I am getting attached error in npm run serve

If you do use a test network, you doesn’t need to run a UI server separately, you can navigate to the address and port of the satellite address, for storj-sim the port starts from 10002 by default.
For storj-up the port starts from 10000 by default.

but you are correct, the serve command is not supported, so the README.md file is not updated.

1 Like

Dear Alexey,

Is there any way to set up a development environment for front-end (i.e. vue js) project where the hot reloads will work. Creating a production build each time and running on 10002 will be time consuming.

I’m not sure that it can work without a backend, so you need to have a backend, thus why to run another one server?
If you would like to run it without a backend (this way it will be almost useless, but well), I guess you need to mock a backend somehow.
I would ask the team, but I need more details - why do you want to run it like that?

I wanted to run like that so that any changes done in front-end get reflected instantly. Currently, for a minor change also a build has to be created and then tested.

Anyways, will check from my end also for a solution to this.

If npm run dev gives you an error, it may be that you are missing some dependencies. Usually an npm install is required first, to resolve all of the dependencies. Once that is done, then npm run dev and leaving it running should allow for hot reload.

If you’ve done these steps in the correct order and it’s not working, can you verify a few things for us?

  1. The version of node you’re using
  2. The version of npm you’re using
  3. What storj build you are using
  4. What OS you are using

With this info, I can try and duplicate the issue.

I can reproduce it on Linux

$ npm version
{
  'storj-satellite': '0.1.0',
  npm: '9.8.1',
  node: '20.6.1',
  acorn: '8.10.0',
  ada: '2.6.0',
  ares: '1.19.1',
  base64: '0.5.0',
  brotli: '1.0.9',
  cjs_module_lexer: '1.2.2',
  cldr: '43.1',
  icu: '73.2',
  llhttp: '8.1.1',
  modules: '115',
  napi: '9',
  nghttp2: '1.55.1',
  nghttp3: '0.7.0',
  ngtcp2: '0.8.1',
  openssl: '3.0.10+quic',
  simdutf: '3.2.17',
  tz: '2023c',
  undici: '5.23.0',
  unicode: '15.0',
  uv: '1.46.0',
  uvwasi: '0.0.18',
  v8: '11.3.244.8-node.14',
  zlib: '1.2.13.1-motley'
}
  1. Install and build
$ git clone https://github.com/storj/storj.git
$ cd storj/web/satellite
$ npm install
$ npm build
$ npm run dev -- --host 172.23.182.203
  1. Navigate to http://172.23.182.203:5173/static/dist
    In the developer console:
Uncaught SyntaxError: The requested module '/static/dist/node_modules/.vite/deps/vue.js?v=f846235c' does not provide an export named 'Component' (at ButtonIcon.vue:18:10)

https://transfer.sh/iKN7vI2ORq/172.23.182.203.har