Реагировать не рендеринг во всплывающем окне расширения Chrome
У меня проблемы с тем, что мое приложение React ничего не отображает во всплывающем окне расширения Chrome. Кроме того, я использую Parcel как веб-упаковщик, чтобы хранить файлы в формате расширения chrome.
Я использовал расширение шаблона chrome для всплывающего окна, и оно работало с шаблоном, но когда я немного отредактировал файлы, он больше не будет отображаться.
Мое всплывающее окно - это просто банк, и не отображается приложение index.js.
index.js
class App extends Component {
render() {
return (
<div className = "App">
<header className = "App-header">
<img src = {logo} className = "App-logo" alt = "logo" />
<h1 className = "NLP-title">NLP extension</h1>
</header>
<h2>Information regarding user info here:</h2>
<body className = "NLP-webpageinfo"> TEST </body>
</div>
);
}
}
ReactDOM.render(<App />, document.getElementById('root'));
index.html сниппет
<div id='root'></div>
фрагмент manifest.json
"browser_action": {
"default_popup": "src/index.html"
}
Любая помощь была бы замечательной. Я думаю, что у меня есть какой-то синтаксис / несоответствие где-то в index.js, но я не слишком опытен в разработке реакции.
загрузить как в: <script type = "text / javascript" src = "src / index.js"> </script>?
Ответы 1
Ознакомьтесь с этим пакетом (даже если вам не нужно использовать redux, настройка поможет вам с настройкой)
Вам нужно загрузить файлы js в свой index.html (реагировать и индексировать). Обратите внимание, что во всплывающем окне есть собственные инструменты разработчика, доступные через контекстное меню «осмотреть».