Форум программистов, компьютерный форум, киберфорум
JavaScript для начинающих
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.67/3: Рейтинг темы: голосов - 3, средняя оценка - 4.67
6 / 6 / 2
Регистрация: 27.08.2015
Сообщений: 99

Не прогружаются картинки из db.json

05.09.2023, 11:49. Показов 670. Ответов 7
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте! Не читается файл db.json и нет картинок на главной странице. Прошу опытных посмотреть на файл maindata.js, проблема с fetch. Проблема или в путях или я что-то не прописал в конфиг webpack 5?

https://github.com/mikhail2013ru/anime-copy
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
05.09.2023, 11:49
Ответы с готовыми решениями:

Не прогружаются картинки
Только учусь spring, делаю проект по видео, но у меня почему-то не прогружаются картинки при их добавлении(1 скрин). Началось всё с того...

Не прогружаются некоторые картинки в браузере
Почему у меня в интернете не прогружаются некоторые картинки? Как это исправить? У меня браузер опера. Пробовал ставить мазиллу - такая же...

Не прогружаются некоторые картинки в браузере
Почему у меня в интернете не прогружаются некоторые картинки? Как это исправить? У меня браузер опера. Пробовал ставить мазиллу - такая же...

7
 Аватар для pincet
1654 / 1153 / 173
Регистрация: 23.07.2010
Сообщений: 6,910
05.09.2023, 12:34
.json() так-то тоже асинхронный
0
Эксперт .NET
 Аватар для Usaga
14093 / 9310 / 1349
Регистрация: 21.01.2016
Сообщений: 34,980
05.09.2023, 12:35
kish2015, и что? Нам предлагается полное review кода проводить? А может ты в браузере F12 нажмёшь и изучишь содержимое вкладок "network" и "console" и сведёшь вопрос до конкретных сообщений об ошибках?
0
6 / 6 / 2
Регистрация: 27.08.2015
Сообщений: 99
05.09.2023, 12:44  [ТС]
Я нашёл причину ошибки. Webpack компилирует index.html в dist с неправильным путём для main.js

JavaScript
1
<script defer src="main.js"></script></head>
- неверно

в исходниках путь такой
JavaScript
1
<script src="../dist/main.js" defer></script>
Вопрос, где прописать правильный путь для main?

Вот конфиг:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const MiniCssExtractPlugin = require("mini-css-extract-plugin")
 
const mode = process.env.NODE_ENV || 'development'
const devMode = mode === 'development'
const target = devMode ? 'web' : 'browserslist'
const devtool = devMode ? 'source-map' : undefined
 
module.exports = {
    mode,
    target,
    devtool,
    devServer: {
        open: true,
        hot: true,
    },
    entry: [ 
        '@babel/polyfill',
        path.resolve(__dirname, './src/js', 'main.js'),
    ],
    output: {
        path: path.resolve(__dirname, 'dist'),
        clean: true,
        filename: '[name].js',
        // assetModuleFilename: 'assets/[name][ext]'
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: path.resolve(__dirname, './src', 'index.html')
        }),
        new MiniCssExtractPlugin({
            filename: '[name].[contenthash].css',
        })
    ],
    module: {
        rules: [
            {
                test: /\.html$/i,
                loader: "html-loader",
            },
 
            {
                test: /\.woff2?$/i,
                type: 'asset/resource',
                generator: {
                    filename: 'fonts/[name][ext]'
                }
            },
 
            {
                test: /\.(jpe?g|png|webp|gif|svg)?$/i,
                use: [
                    {
                        loader: 'image-webpack-loader',
                        options: {
                            mozjpeg: {
                            progressive: true,
                            },
                            // optipng.enabled: false will disable optipng
                            optipng: {
                            enabled: false,
                            },
                            pngquant: {
                            quality: [0.65, 0.90],
                            speed: 4
                            },
                            gifsicle: {
                            interlaced: false,
                            },
                            // the webp option will enable WEBP
                            webp: {
                            quality: 75
                            }
                        }
                    }
                ],
                type: 'asset/resource',
                generator: {
                    // filename: 'images/[name][ext]'
                    filename: 'images/[hash][ext][query]'
                }
            },
 
            {
                test: /\.(c|sa|sc)ss$/i,
                use: [
                  // Creates `style` nodes from JS strings
                  devMode ? "style-loader" : MiniCssExtractPlugin.loader,                  
                  // Translates CSS into CommonJS
                  "css-loader",
                  {
                    loader: 'postcss-loader',
                    options: {
                        postcssOptions: {
                            plugins: [require('postcss-preset-env')],
                        }
                    }
                  },
                  // Compiles Sass to CSS
                  "sass-loader",
                ],
            },
 
            {
                test: /\.(?:js|mjs|cjs)$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: [
                            ['@babel/preset-env', { targets: "defaults" }]
                        ]
                    }
                }
            }
        ],
    },
}
0
 Аватар для pincet
1654 / 1153 / 173
Регистрация: 23.07.2010
Сообщений: 6,910
05.09.2023, 13:11
kish2015,
JavaScript
1
2
3
fetch('../db/db.json')
    .then((response) => {
        return response.json()
в тут ты поимеешь не совсем то, что хотел
0
6 / 6 / 2
Регистрация: 27.08.2015
Сообщений: 99
05.09.2023, 22:14  [ТС]
pincet,

JavaScript
1
fetch('../db/db.json')
Путь можно укоротить и до db.json вообще, но как тогда этот файл при компиляции закидывать автоматически в dist? В каталоге есть же и другие .json файлы. Как их игнорировать?
0
Модератор
Эксперт JS
 Аватар для Eva Rosalene
5241 / 2115 / 416
Регистрация: 06.01.2013
Сообщений: 4,846
06.09.2023, 10:29
Цитата Сообщение от kish2015 Посмотреть сообщение
как тогда этот файл при компиляции закидывать автоматически в dist
CopyWebpackPlugin
2
 Аватар для pincet
1654 / 1153 / 173
Регистрация: 23.07.2010
Сообщений: 6,910
06.09.2023, 12:01
Цитата Сообщение от kish2015 Посмотреть сообщение
1
fetch('../db/db.json')
вернет (ясен пень только с await) только хмм, статус ответа
если хоцца результатов - нужно еще раз попросить асинхронно или json или text или черта лысого. но нужно
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
06.09.2023, 12:01
Помогаю со студенческими работами здесь

Изображения долго прогружаются или не прогружаются вовсе
До начала июля все было нормально. В июле и августе интернета не было. Сейчас появился интернет захожу на какой нибудь сайт и очень долго...

Перевод картинки из string[] из Json в BitmapImage
Не понимаю, почему при остановке на строке return bitmapImage; метод возвращает принятую картинку, а если не останавливаться, то возвращает...

JSON массив, получить url картинки и записать в div
Доброго времени суток. Есть пара вопросиков 1) как пройтись по массиву JSON, чтобы выбрать из элемента массива все значения thumb_url ...

Не прогружаются иконки
Доброго времени суток. Прошу помощи. Не прогружаются иконки при входе на сайт. При переходе в группы товаров, иконки появляются. Их нет...

Не прогружаются браузеры
Добрый день. Проблема в том что любой браузер не прогружается до конца,либо пишет страница не найдена.Но если несколько раз делать обновить...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
8
Ответ Создать тему
Новые блоги и статьи
Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка.
Programma_Boinc 23.12.2025
Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Рецензия / Мнение/ Перевод https:/ / **********/ gallery/ thinkpad-x220-tablet-porn-gzoEAjs . . .
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
Как объединить две одинаковые БД Access с разными данными
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .
Ломающие изменения в C#.NStar Alpha
Etyuhibosecyu 20.11.2025
Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .
Мысли в слух
kumehtar 18.11.2025
Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru