Size: a a a

Webpack — русскоговорящее сообщество

2020 July 29

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Kostya Zgara
Всем привет. Ребят никто не сталкивался как с помощью create-react-app сделать билд так, чтобы на выходе получался только один html файл, а все ассеты типа css, js были встроенны инлайном в этот html файл в теги <style>, <script> соответственно. Смотрел на вот такой плагин https://github.com/DustinJackson/html-webpack-inline-source-plugin но он к сожалению не поддерживается и не работает с новой версий HtmlWebpackPlugin. Есть еще какие-то варианты как этого можно достичь?

Варианты типа вручную подключить react и babel в index.html и писать компоненты прямо там пока что не рассматриваю. Хотелось бы иметь полностью весь функционал create-react-app.
Эмм нет это так не делается, пишите js в js файлах пожалуйста)
источник

KZ

Kostya Zgara in Webpack — русскоговорящее сообщество
Я понимаю что это так не делается, но поверьте мне, так надо)
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Kostya Zgara
Я понимаю что это так не делается, но поверьте мне, так надо)
Проверьте вам так не надо ))
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Во первых 1 файл вместо 10 будет качатся (усредняя) в 10 раз медленее, во вторых вы не сможете нормально пользоваться кешем, в третьих это усложняет парсинг и в некоторых случаях он гарантировано сломается
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Например строчка типа
const bug = "</script>" валидный js который однако не может быть написан прямо в script тэге
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Какой бы вы там костыль не делали - настоятельно рекомендую поискать ещё какой-то другой способ
источник

KZ

Kostya Zgara in Webpack — русскоговорящее сообщество
Alex CherryTea
Проверьте вам так не надо ))
Ладно расскажу тогда зачем я это делаю, чтобы не было лишних вопрсов. Одна платформа предоставляет hosted pages и единственный путь кастомизировать UI это загружать свой html. Они прям у себя в доках показывают пример, что делайте js в <script> а стили в <style>. Так вот это платформа с жуткими ограничениями и не совсем подходит под бизнес задачи проекта. Решил обойти это путем подключить туда SPA с роутером и тд. Я сейчас всего лишь на стадии изучения и ресечинга. Для вывода я должен проработать каждый вариант, поэтому и спрашиваю у вас какие есть варианты, чтобы я писал обычным для меня способом, но на выходе получался только один html файл.

Со всеми минусами я знаком, поэтому не стоит тратить своё время, чтобы доказать мне что так лучше не делать)
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Kostya Zgara
Ладно расскажу тогда зачем я это делаю, чтобы не было лишних вопрсов. Одна платформа предоставляет hosted pages и единственный путь кастомизировать UI это загружать свой html. Они прям у себя в доках показывают пример, что делайте js в <script> а стили в <style>. Так вот это платформа с жуткими ограничениями и не совсем подходит под бизнес задачи проекта. Решил обойти это путем подключить туда SPA с роутером и тд. Я сейчас всего лишь на стадии изучения и ресечинга. Для вывода я должен проработать каждый вариант, поэтому и спрашиваю у вас какие есть варианты, чтобы я писал обычным для меня способом, но на выходе получался только один html файл.

Со всеми минусами я знаком, поэтому не стоит тратить своё время, чтобы доказать мне что так лучше не делать)
Что насчёт нормальных платформ бесплатного хостинга страничек типа сурж, нетлифай?
источник

KZ

Kostya Zgara in Webpack — русскоговорящее сообщество
Alex CherryTea
Что насчёт нормальных платформ бесплатного хостинга страничек типа сурж, нетлифай?
Не знаю почему вы не хочете просто помочь мне с моим вопросом, но если вам все таки хочется докопаться до истины, то я не против) Речь идет про платформу Auth0 (надеюсь объяснять почему выбор пал на эту платформу мне не придется 😂) , бизнесу нужно кастомизировать там практически все, в доках такого нет и на форумах люди сами не знают как сделать так. Поэтому прежде чем говорить бизнесу, что ничего не получится, мне бы хотелось проработать все варианты
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Kostya Zgara
Не знаю почему вы не хочете просто помочь мне с моим вопросом, но если вам все таки хочется докопаться до истины, то я не против) Речь идет про платформу Auth0 (надеюсь объяснять почему выбор пал на эту платформу мне не придется 😂) , бизнесу нужно кастомизировать там практически все, в доках такого нет и на форумах люди сами не знают как сделать так. Поэтому прежде чем говорить бизнесу, что ничего не получится, мне бы хотелось проработать все варианты
А айфрейм туда вставить можно?
источник

KZ

Kostya Zgara in Webpack — русскоговорящее сообщество
Alex CherryTea
А айфрейм туда вставить можно?
Нет, потому что это платформа заточена на секюрность и всякие запросы с iframe будут отрубаться
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Kostya Zgara
Не знаю почему вы не хочете просто помочь мне с моим вопросом, но если вам все таки хочется докопаться до истины, то я не против) Речь идет про платформу Auth0 (надеюсь объяснять почему выбор пал на эту платформу мне не придется 😂) , бизнесу нужно кастомизировать там практически все, в доках такого нет и на форумах люди сами не знают как сделать так. Поэтому прежде чем говорить бизнесу, что ничего не получится, мне бы хотелось проработать все варианты
Я даже не знаю чем вам помочь. Таких либ нету или они умерли просто поскольку это за пределами бестарактис
источник

KZ

Kostya Zgara in Webpack — русскоговорящее сообщество
Alex CherryTea
Я даже не знаю чем вам помочь. Таких либ нету или они умерли просто поскольку это за пределами бестарактис
Понял) Тогда спасибо за содействие) Буду двигаться дальше!
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Kostya Zgara
Понял) Тогда спасибо за содействие) Буду двигаться дальше!
Вы всегда можете написать свой плагин к вебпаку
источник

KZ

Kostya Zgara in Webpack — русскоговорящее сообщество
Alex CherryTea
Вы всегда можете написать свой плагин к вебпаку
Окей, буду иметь ввиду) Еще раз спасибо!
источник

АН

Андрей Неумыванный... in Webpack — русскоговорящее сообщество
Подскажите, в чем мой косяк, если прописать в index.js(файл в который все импорты делаем)  console.log("Hello") - в консоле ничего не выдает
источник

АН

Андрей Неумыванный... in Webpack — русскоговорящее сообщество
стили подгружает
источник

АН

Андрей Неумыванный... in Webpack — русскоговорящее сообщество
и файл с js скриптом тоже грузит, а именно лог не выводит
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Андрей Неумыванный
и файл с js скриптом тоже грузит, а именно лог не выводит
не тот файл подключили? Выключили в консоли отображение логов?
источник

АН

Андрей Неумыванный... in Webpack — русскоговорящее сообщество
Alex CherryTea
не тот файл подключили? Выключили в консоли отображение логов?
Есть итоговый файл index.js в него я делаю импорты стилей, библиотек и пр. Так вот если в нем я напишу консоль лог ... то он же должен вывести мне что-то?
источник