Как собрать create-react-app без минификации?

Question

[Павел Третьяков]

Даров, пацаны, феминистки, девушки и лесбияны.
Встала задача, сделать билд create-react-app без минификации файлов (долго объянсять, а в кратце - j is not a function :) ).
Кто-нибудь сталкивался? Не хочется делать reject, и так хорошо.
Заранее спасибо.

Comments

[Astrohas]

Даров, пацаны, феминистки и девушки.

Я идентифицирую себя лесбияном. Почему меня нет тут? Гомофоб

[Павел Третьяков]

Astrohas, по многочисленным требованиям лесбиянов, внес правку в вопрос. Пожалуйста, лесбияны, не устраивайте митинг у моего дома :)

Answer 1

[Mikhail Osher]

Никак.

Answer 2

[Антон Спирин]

В этом нет необходимости, так как create-react-app генерирует source maps. Рекомендую научиться пользоваться панелью разработчика.
Ну и воспользуйтесь советом profesor08. Это, при правильном использовании, избавит вас от целого класса багов и ошибок в рантайме.

Comments

[Павел Третьяков]

Вопрос стоял "как сделать билд create-react-app без минификации файлов". Если у Вас нет в этом необходимости, это не значит, что она не может возникнуть. Если бы Я знал, что у меня появится данная потребность то не стал бы наверное использовать данный инструмент.

[Антон Спирин]

Павел Третьяков, на вопрос вам ответили выше, не вижу смысла повторяться.
Попробуйте обосновать необходимость в отключении минификации, при наличии source maps. Когда даже в production сборке вы видите в панели разработчика все исходные коды вплоть до node_modules.
Если у вас возникла подобная потребность, то вы что-то делаете не правильно.
Ну и вишенка на торте это то, что в development режиме никакой минификации нет и так же используются source maps, при этом некоторые пакеты попадают в сборку в development версиях.

[Павел Третьяков]

- Минифицированные функции, с измененным именем, которые передаются во фреймы, не могут быть вызваны в нём, так как имя всегда разное (точнее имена функций используемые в передаваемой функции).
- На просторах интернета тестеры жалуются, что не могу писать авто тесты, скорее всего для проверки прода сборки.
... и так далее и тому подобное. (https://vk.cc/9Emw7l)

Можете сколько угодно оборачивать систему блестяшками и картами, всех нюансов Ваш мозг не в состоянии предусмотреть.

А вообще, можно конечно мудохаться по каждому вопросу и добиваться решения (это же программирование, можно найти решение чему угодно, что Я и сделал), но если необходимо сдать приложение на конкурс в течении нескольких часов, то философия может немного подождать и уступить место быстрому, пускай и грубому решению, которое Я любезно попросил у жителей сего форума. ...раньше мир жил без всей фреймворковой дичи, а интернет делал свое дело - отображал информацию на экране монитора без каких-либо единорогов и летающих котов, хотя Вру :-D как раз многие страницы были заполнены летающими снежинками, изображениями бегающими за курсором и анимированными фонами, собственно для этого только и существовал javascript... сам таким злоупотреблял.

[Антон Спирин]

Павел Третьяков,

Минифицированные функции, с измененным именем, которые передаются во фреймы, не могут быть вызваны в нём, так как имя всегда разное (точнее имена функций используемые в передаваемой функции).

Тут уже проблема в непонимании того, как работает webpack.
Для решения подобной проблемы поможет банальное:
window.myVariable = myVariable;
А вот отсутствие минификации тут никак не поможет, так как модули вашего приложения инкапсулированы сборщиком и находятся в отдельном пространстве имен.

[Павел Третьяков]

Антон Спирин,

Answer 3

[Astrohas]

Перенастройте под Webpack. Можете использовать готовые бойлеры типа https://github.com/react-boilerplate/react-boilerplate (монстр из всего на свете) ну или https://github.com/flexdinesh/react-redux-boilerplate (упрощенная версия)

Увы create-react-app УГ, которое годится только для одностраничных лендингов под github.io.

Comments

[Павел Третьяков]

Спасибо за ссылочку Astrohas. Вот Я и о том же :) знал бы, что понадобиться данный фукнционал, так использовал какой-нибудь бойлер или сам сборку сделал по требованиям. Участвовал в хакатоне, не было времени на раздумывание непредвиденностей :)

Answer 4

[War1ock1994]

Если интересно, могу дать линк на пустой проект (несколько месяцев назад собирал с 0 под себя для react).
Собственно там нужно тебе будет только поменять зависимости, ну и изменить настройку в webpack (а может и нет, точно не помню уже).

Comments

[Павел Третьяков]

Это здорово, спасибо за подмогу War1ock1994 :) но тогда отпадает вся прелесть create-rect-app )) тогда уж проще свои бойлерпалетты заюзать )

[War1ock1994]

Павел Третьяков, а в чем собственно прелесть create-react-app?
Тебе же проще самому разобраться во всём, сейчас увы, простые фронты никому не нужны.
Кругом фул-стэк, а без create-react-app тут тебе и фронт и бэк, и dev-ops наконец при желании зааплоадиться на облако.
Как человек, который сам начинал эту тему изучать советую очень, начни прямо с нуля разворачивать этот стэк, ты ни разу не пожалеешь в будущем что прошёл через этот "ад" с развертыванием.
А потом нихай себе сохрани папку, да зависимости раз в месяц меняй на новых проектах из-за webpack и его скорости обновления всех своих док)

Answer 5

[profesor08]

Включи TypeScript, и всякие "j is not a function" отпадут сами собой.

Comments

[Павел Третьяков]

Мне уже надоел TypeScript. И проблема не в том, что Я не могу отследить откуда идет объект, а в том, что по некоторым причинам (много писать), сценарий обращается к минифицированной функции f() по неминифицированному имени someName().

[profesor08]

Павел Третьяков, стектрейс в любом случае будет и там видно в каком модуле косяк, даже если нету сурсмап. Если ты каким-то образом получаешь сигнатуру функции, потом где-то ее сохраняешь, потом билдишь проект, то независимо от минификации, сигнатура будет неверной, так как сборщих оборачивает все модули в отдельные пространства имен.