How to use static files?

[CyberSinister]

Hello, This is a great project. I'm very new to VueJS itself (let alone Electron) so I understand that it might be unfair to post an issue here but I didn't know who else to turn to.

I'm not very skilled with VueJS nor am I skilled with Electron. I'm trying to import 2 stylesheets and 2 scripts in my renderer index.html like so:

<link rel="stylesheet" href="../main/static/css/plugins.bundle.css"> <link rel="stylesheet" href="../main/static/css/style.bundle.css"> Under the title in the header

And the below scripts under the ./main.ts import <script src="../main/static/js/scripts.bundle.js"></script> <script src="../main/static/js/plugins.bundle.js"></script>

I still get a 404. What am I doing wrong (other than presumably everything)? I'd be eternally grateful if you'd be so kind so help me out here.

Also, a side note is that scripts.bundle.js is exactly what it sounds like, a bundle of scripts which everything libraries like popper, jQuery and Swal.

[Deluze]

Hey thanks for using this project, that means a lot!

Take this as a general rule of thumb: The main/renderer processes should only reference the files from their own directory. Files in the renderer directory can only be referenced by the renderer process, files in the main directory should only be referenced by the main/electron process.

What you're looking for is the renderer/public directory. Each file located in that directory will be accessible through the renderer using an absolute path like /style.css

Assuming you will have the following directory structure:

  > src
    > renderer
      > public
        > css
          - plugins.bundle.css
          - style.bundle.css
        > js
          - plugins.bundle.js
          - scripts.bundle.js

You can reference these files like /css/plugin.bundle.css, /js/scripts.bundle.js in your HTML.

Also, a side note is that scripts.bundle.js is exactly what it sounds like, a bundle of scripts which everything libraries like popper, jQuery and Swal.

Since you're using a package manager to run and build the Electron app, I recommend you to install them as a node module, so you can easily manage package versions etc. Not sure if you have any special requirements that you're doing it your way.

Let me know if this solves your issue 😉 you can also open up a discussion under the Discussions tab, but I'm not that strict with issues here.

[Deluze]

Closing because of inactivity.