Ошибка Minified React # 152 - как решить эту проблему?
Я получаю сообщение об ошибке ниже, хотя я использую среду разработки. Ниже мой файл package.json.
Error: "for the full message or use the non-minified dev environment for full errors and additional helpful warnings."
Package.json файл:
"scripts": {
"compile": "webpack",
"start": "node server.js",
"dev": "webpack --mode development",
"build": "webpack --mode production",
"test": "echo \"Error: no test specified\" && exit 1"
},
Я делаю npm run build, а затем npm run start. Тем не менее, я получаю ту же миниатюрную ошибку, я попытался удалить папку bundle.js или ./dist и выполнил сборку в среде разработки, но я столкнулся с той же проблемой.
Может ли кто-нибудь помочь мне, как я могу избежать этой миниатюрной версии и легко отлаживать файлы локально?
Ответы 4
Описание ошибки - здесь, вы ничего не возвращаетесь в результате rendermethod вашего реагирующего компонента. Верните вместо него что-нибудь другое.
@ IAmRkrishnaV21 Если вы хотите иметь читаемый минифицированный исходный код, вам нужно использовать «карту источников», самый простой способ в webpack - использовать devtool: 'inline-source-map' (webpack.js.org/configuration/devtool), но это еще одна тема, не соответствующая вашему исходному вопросу. Если вы разрешили исходный вопрос с моим ответом, отметьте его как правильный ответ, пожалуйста.
Спасибо за самый простой способ использования webpack. Мой реальный вопрос был таким же => как я могу избежать этой уменьшенной версии и легко отлаживать файлы локально. Мне предложили ту же ссылку, которую вы предоставили в response, но в любом случае это синтаксическая ошибка. Более позднее решение помогло мне избежать упрощенной отладки миниатюрной версии, поэтому я отмечаю это как правильный ответ, поскольку я не могу сделать это для вашего предыдущего комментария.
Если это кому-то поможет, я решил эту проблему, вернув null вместо false (моя функция заключена в HOC)
Edit: иногда мне не хотелось ничего рендерить. В таком случае я вернул false в методе рендеринга примерно так:
render(){
return condition && <ThingsIWantToDisplay/>; //condition is a boolean
}
Затем класс компонента помещается в HOC (для обеспечения контекста React) следующим образом:
export default HOC(Component);
Когда condition - это false, в производственной сборке возникает ошибка.
Изменение функции рендеринга, как показано ниже, решило проблему:
render(){
return condition?<ThingsIWantToDisplay/>:null; //condition is a boolean
}
Вы спасли мне жизнь этим ответом по совершенно другой проблеме! Большое спасибо !
Удалите любые комментарии внутри метода render / return
I used this regex in VSCode to find the troublesome comments: (\s*\n?\s*//
Дополнительная помощь здесь
ты спас мне день
К вашему сведению: всего двух слэшей (без чего-либо после) достаточно, чтобы все испортить и получить эту ошибку 152. Потребовалось время, чтобы это найти. Супер раздражает!
У меня была такая же проблема. Итак, я удалил комментарии внутри своей функции рендеринга, и это сработало!
Спасибо за ответ. Я проверил эту ошибку. Каким-то образом я решил эту ошибку, раскомментировав свой последний код и обнаружив проблему с синтаксисом. Но как я могу избежать этого миниатюрного кода при работе в среде разработки? Я не могу отлаживать код построчно в инструментах разработчика Chrome, когда он минифицирован.