Built code errors in Electron: Failed to execute 'querySelector' on 'Document'-CodePudding

Using Vite to build the app, I am getting the following error inside Electron:

index.c160f204.js:9 DOMException: Failed to execute 'querySelector' on 'Document': 'link[href="/C:UsersrankDocumentsSchoolCheckInElectronReaderdist/assets/Home.b0f26e4d.js"]' is not a valid selector.

It appears to me that the path inside the built code has the slashes removed, but I have no idea on how to solve that since it's generated code.

Using Node 17.9.0 on Windows 11 10.0.22000 Build 22000

Electron main.js:

const { app, BrowserWindow } = require("electron");
const path = require("path");

function createWindow() {
    const win = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

    win.loadFile("dist/index.html");
}

app.whenReady().then(() => {
    createWindow();

    app.on("activate", () => {
        if (BrowserWindow.getAllWindows().length === 0) {
            createWindow();
        }
    });
});

app.on("window-all-closed", () => {
    if (process.platform !== "darwin") {
        app.quit();
    }
});

Electron preload.js:

window.addEventListener("DOMContentLoaded", () => {
    const replaceText = (selector, text) => {
        const element = document.getElementById(selector);
        if (element) element.innerText = text;
    };

    for (const type of ["chrome", "node", "electron"]) {
        replaceText(`${type}-version`, process.versions[type]);
    }
});

Vite.config.ts:

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import * as path from "path";


// https://vitejs.dev/config/
export default defineConfig({
  base: path.resolve(__dirname, './dist'),
  plugins: [
    vue(),
  ],
})

Using vue-tsc --noEmit && vite build to build and electron . to start.

CodePudding user response：

If you copy/paste the faulty code into a browser console, you will notice a non UTF-8 character in your link, between Users and rank.

Get rid of it and it should work.

The simplest way to fix this would be to move the project to a path which doesn't contain weird chars (e.g: C:/projects/)