У меня есть приложение Node.js, предназначенное для загрузки файла css на S3 для использования на моем веб-сайте. Кажется, все работает нормально, но когда я обращаюсь к файлу на своем веб-сайте, ни одно из изменений css не применяется. Я даже вижу файл css в разделе «Инструменты/источники разработчика». Однако css в этом файле не действует. Если я внесу какие-либо изменения в файл в инструментах разработки, css сразу начнет работать. Если я скачаю файл с s3, а затем перезалью его вручную, ничего не меняя, это тоже сработает. Так что что-то, связанное с форматированием, когда я добавляю файл с Node.js, отбрасывает его. Любая помощь в этом будет принята с благодарностью.
let globalStyles = `.header-background{background-color:${themeStyles['headerBackground']};}
//using this to remove backticks from globalStyles
globalStyles = globalStyles.replace(/^`|`$/g, '');
await addFileCssS3(css, `${newUrl}/global.css`, newUrl);
const addFileCssS3 = async (file, key, newUrl) => {
await s3
.putObject({
Body: file,
Bucket: BucketName,
Key: key,
ContentType: 'text/css',
})
.promise()
.catch((error) => {
console.error(error)
})
}
Нет ответа, поэтому голосование за закрытие неясно.
Чтобы исправить это, вы можете попробовать удалить новую строку из строки globalStyles, прежде чем передавать ее методу addFileCssS3. Есть несколько способов сделать это, один из них — просто использовать свойство .trim() для удаления всех начальных и конечных пробелов из строки.
Например:
globalStyles = globalStyles.trim();
Или, используя регулярное выражение, чтобы удалить символ новой строки в конце строки globalStyles:
globalStyles = globalStyles.replace(/\r?\n|\r/g, '');
Второй метод, использующий регулярное выражение, должен работать для удаления новых строк как в Windows, так и в Linux.
Другой возможной причиной может быть неудачный вызов функции, которая повторно вставляет CSS в html-страницу, возможное отсутствие этой функции приводит к тому, что загруженный CSS не используется.
Если это не решит проблему, я рекомендую проверить заголовок Content-Type файла CSS при загрузке на S3, чтобы убедиться, что он установлен правильно. Также проверьте, настроены ли разрешения корзины S3 или параметры кэширования браузера, чтобы не разрешать использование обновленного CSS.
Как вы думаете, почему в строке есть новая строка и как новая строка в конце правила CSS может вызвать какие-либо проблемы? Почему первый метод не удаляет новые строки как в Windows, так и в Linux? И зачем вам использовать чередование вместо класса символов в вашем регулярном выражении?
Подсветка синтаксиса в коде предполагает, что в приведенном здесь коде есть опечатка. Кроме того, почему в ваших правилах CSS должны быть обратные ссылки, и зачем вам тогда нужно их удалять?