I'm trying to load a css file in electron. I found other people with a related issue, their solution doesn't solve a thing for me. When I open my devtools it says:
Failed to load resource: net::ERR_FILE_NOT_FOUND index.css:1
And when I hover over the index.css it does in fact show the correct file location, it says:
file///C:/Users/myusername/myproject/src/assets/css/index.css
This file path corresponds 100% correctly with the path to my css file. My code is as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>My Project</title>
<link rel="stylesheet" href="assets/ccs/index.css">
</head>
<body>
<h1>This is just the beginning</h1>
Great things to come
<script src="../renderer.js"></script>
</body>
</html>
I've tried changing the link to href="./assets/css/index.css" as well as just "/assets/css/index.css", didn't change anything.
And js code:
const { app, BrowserWindow } = require('electron')
const path = require('path')
let mainWindow
function createWindow() {
// Create the browser window.
mainWindow = new BrowserWindow({
width: 800,
height: 600,
frame: false,
webPreferences: {
nodeIntegration: true,
enableRemoteModule: true,
preload: path.join(__dirname, 'preload.js')
}
})
mainWindow.loadFile('src/index.html')
mainWindow.on('closed', function () {
mainWindow = null
})
}
app.on('ready', createWindow)
app.on('window-all-closed', function () {
if (process.platform !== 'darwin') app.quit()
})
app.on('activate', function () {
if (mainWindow === null) createWindow()
})
I've been looking at this for hours on end and can't find what is wrong, the code is based off of electron's starting guide so I assumed it would work. If anyone could help me out here I'd greatly appreciate it!
EDIT: My file structure tree
+-- src
| +-- assets
| +-- css
| +--index.css
| +-- index.html
+-- index.js
+-- package-lock.json
+-- package.json
+-- preload.json
+-- renderer.json