Ошибка Failed to load resource: net::ERR_FILE_NOT_FOUND

Question

подобной ошибке как у меня не нашёл. Делал проект на галп, галп открывал его на локальном сервере где все файлы подключались нормально. Как сделал макет, зашёл через index.html и увидел что у меня половину файлов не подключено. Например картинки, половину картинок есть, а остальных нет хотя путь указывал одинаковый. CSS подключилось, но шрифты которые я в нем указывал и которые лежат в папке public не подключились. JS тоже не подключился. Смотрел правильность написания путей, все правильно. Менял скобки на одинарные, ничего не выходит. js, css, image, font лежат в той же папке что и index.html

@font-face {
  font-family: "Cabinet Grotesk";
  font-weight: 700;
  font-style: normal;
  src: url("/font/CabinetGrotesk/CabinetGrotesk-Bold.eot");
  src: local("Cabinet Grotesk"), url("/font/CabinetGrotesk/CabinetGrotesk-Bold.eot?#iefix") format("embedded-opentype"), url("/font/CabinetGrotesk/CabinetGrotesk-Bold.woff2") format("woff2"), url("/font/CabinetGrotesk/CabinetGrotesk-Bold.woff") format("woff"), url("/font/CabinetGrotesk/CabinetGrotesk-Bold.ttf") format("truetype");
}

@font-face {
  font-family: "Cabinet Grotesk";
  font-weight: 900;
  font-style: normal;
  src: url("/font/CabinetGrotesk/CabinetGrotesk-Black.eot");
  src: local("Cabinet Grotesk"), url("/font/CabinetGrotesk/CabinetGrotesk-Black.eot?#iefix") format("embedded-opentype"), url("/font/CabinetGrotesk/CabinetGrotesk-Black.woff2") format("woff2"), url("/font/CabinetGrotesk/CabinetGrotesk-Black.woff") format("woff"), url("/font/CabinetGrotesk/CabinetGrotesk-Black.ttf") format("truetype");
}

@font-face {
  font-family: "Helvetica Now Display";
  font-weight: 400;
  font-style: normal;
  src: url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Regular.eot");
  src: local("Helvetica Now Display"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Regular.eot?#iefix") format("embedded-opentype"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Regular.woff2") format("woff2"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Regular.woff") format("woff"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Helvetica Now Display";
  font-weight: 500;
  font-style: normal;
  src: url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Medium.eot");
  src: local("Helvetica Now Display"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Medium.eot?#iefix") format("embedded-opentype"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Medium.woff2") format("woff2"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Medium.woff") format("woff"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Medium.ttf") format("truetype");
}

@font-face {
  font-family: "Helvetica Now Display";
  font-weight: 700;
  font-style: normal;
  src: url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Bold.eot");
  src: local("Helvetica Now Display"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Bold.eot?#iefix") format("embedded-opentype"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Bold.woff2") format("woff2"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Bold.woff") format("woff"), url("/font/HelveticaNowDisplay/HelveticaNowDisplay-Bold.ttf") format("truetype");
}

<!DOCTYPE html>
<html lang="ru">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Archee</title>
    <link rel="stylesheet" href="css/main.min.css" />
    <link rel="icon" href="img/favicon/favicon.svg" />
    <link rel="apple-touch-icon" href="apple-touch-icon.png" />
    <link rel="manifest" href="manifest.json" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css" />
</head>

Answer 1

У меня было точно так же. Все просто, ты указал путь к файлам:

src: url("/font/CabinetGrotesk/CabinetGrotesk-Bold.eot");

Если у тебя style.css лежит в папке типа style (или любой другой), то нужно выйти из этой папки, а тогда зайти в нужную, вот так:

src: url("../font/CabinetGrotesk/CabinetGrotesk-Bold.eot");

просто прописать .. в начале пути. Это значит выйти из папки, в которой сейчас лежит файл. Если нужно выйти не из одной папки, а из двух, можно прописать так:

src: url("../../font/CabinetGrotesk/CabinetGrotesk-Bold.eot");

И, соответственно, сколько папок, столько нужно указать ../.

Через "Live Server" в MS Code все работает, потому что он игнорирует это. Но если через index.html запускать, то оно просто не найдет файлов по пути, потому что в папке со стилями таких файлов нету.

БЛОГ НА HUSL

Ошибка Failed to load resource: net::ERR_FILE_NOT_FOUND

Ответы (1 шт):