本文介绍了“拒绝执行内联脚本”在ReactJS Chrome扩展中,即使没有内联脚本的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我熟悉Chrome的扩展插件脚本策略。但是,我不认为我的文件中有一个?我所有的都是非常基本的,我只是试图在页面上放置一个输入字段。

I am familiar with Chrome's policy on inline scripts in Extensions. However, I don't think I have one in my files? All I have is very basic and I'm just attempting to place an input field onto the page.

main.js:

class Container extends React.Component {
    render() {
        return (
            <div className="locationSearchBarContainer">
                <SearchBar />
            </div>
        );
    }
}

class SearchBar extends React.Component {
    render() {
        return (
            <input className="searchBar" id="locationSearchBar" />
        );
    }
}

ReactDOM.render(
    <Container />,
    document.getElementById('container')
);

main.html:

main.html:

<!doctype html>
<html>
  <head>
    <title>New Tab</title>
    <script src="../scripts/plugins/react.min.js"></script>
    <script src="../scripts/plugins/react-dom.min.js"></script>
    <script src="../scripts/plugins/babel.min.js" charset="utf-8"></script>
    <script src="../scripts/main.js" type="text/babel"></script>
  </head>
  <body>
    <div id="container"></div>
  </body>
</html>

manifest.json

manifest.json

{
  "manifest_version": 2,

  "name": "",
  "description": "See what's happening around you and add events to your calendar",
  "version": "0.01",

  "browser_action": {
    "default_icon": "img/icon.png",
    "default_title": "Click here!"
  },
  "chrome_url_overrides" : {
    "newtab": "html/main.html"
  },
  "permissions": [
    "activeTab"
  ]
}


推荐答案

我相信问题在于,在这个Babel版本中,你不能只是建立一个网站的原型,并把它包含在脚本标签中,否则它会在线执行。我再也没有经过Browserify路线的这个问题。

I believe the problem is that in this version of Babel you can't just prototype a site and include the library in a script tag, or it'll execute in-line. I don't have this problem anymore going through the Browserify route.

这篇关于“拒绝执行内联脚本”在ReactJS Chrome扩展中,即使没有内联脚本的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-15 22:52