反应不在 chrome 扩展弹出窗口中呈现答案

【问题标题】：react not rendering in chrome extension popup反应不在 chrome 扩展弹出窗口中呈现
【发布时间】：2018-10-28 23:36:09
【问题描述】：

我的 React 应用程序在我的 chrome 扩展弹出窗口中没有呈现任何内容时遇到了一些问题。另外，我使用 Parcel 作为 webpacker 来将我的文件保存为 chrome 扩展格式。

我为弹出窗口使用了一个模板 chrome 扩展，它与模板一起使用，但是当我稍微编辑文件时，它将不再显示。

我的弹出窗口只是银行，并且没有呈现 index.js 'App'。

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 sn-p

<div id='root'></div>

manifest.json sn-p

  "browser_action": {
    "default_popup": "src/index.html"
  }

任何形式的帮助都会很棒。我想我在 index.js 的某处有某种语法/不匹配，但我对 react 开发并没有太多经验。

【问题讨论】：

你需要在你的 index.html 中加载 js 文件（react 和 index）。请注意，弹出窗口有自己的开发工具，可通过右键菜单“检查”访问。
加载方式为： ?

标签： reactjs google-chrome-extension render

【解决方案1】：

查看这个包（即使你不需要使用redux，setup也会帮你设置）

https://www.npmjs.com/package/react-chrome-redux

【讨论】：