I'm running 'npm run build' to compile my project, and then I use the 'npm run preview' command to view it. However, some images that I've set as background images in my SCSS file are not showing up. The same issue occurs with a font family.
Here is my 'package.json' file:
{
"name": "project-name",
"private": true,
"version": "0.0.0",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"devDependencies": {
"sass": "^1.52.3",
"vite": "^2.9.9"
}
}
And here is my 'vite.config.js' file:
/* Do not edit this file */
import { defineConfig } from 'vite'
export default defineConfig({
build: {
minify: false
}
});
In my SCSS, it seems like Vite doesn't understand the '../../../ directory when compiling:
@font-face {
font-family: "CustomFont";
src: url("../../../src/assets/fonts/Marcheile-Bold-Condensed.woff") format("woff"),
url("../../../src/assets/fonts/Marcheile-Bold-Condensed.otf") format("opentype"),
url("../../../src/assets/fonts/Marcheile-Bold-Condensed.woff2") format("woff2");
}