我正在尝试使用 React 作为我正在开发的 Firefox 插件的一部分。只要我不使用 jsx,React 就可以正常工作。 Babel 不工作 - 因为我无法指定我添加的脚本的类型。
我正在做:
tabs.open({
url: 'index.html',
onReady: function( tab ){
var worker = tab.attach({
contentScriptFile: [
'./jquery-2.1.4.min.js',
'../node_modules/react/dist/react.js',
'../node_modules/react-dom/dist/react-dom.js',
'../node_modules/babel-preset-react/index.js',
'./js/main.js', // the file i need to specify as type: text/babel
],
});
}
);
理想情况下,我能够在 './js/main.js'
脚本上设置类型属性,但文档似乎没有任何内容。
最佳答案
诀窍是像平常一样直接在 html 中加载 React、jquery、babel 和 jsx。您必须使用 contentScriptFile
参数加载的 javascript 文件是您需要加载逻辑以与插件主 js 文件进行通信的文件。
有效 html 的示例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello React!</title>
<script src="react-with-addons.js"></script>
<script src="react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
</head>
<body>
<h1>Hello!</h1>
<div id="example"></div>
<script type="text/babel">
ReactDOM.render(
<p>Hello, world!</p>,
document.getElementById('example')
);
</script>
</body>
</html>
如果您告诉我您需要在该 html/content 脚本中做什么,我可以给您一个示例,说明如何将其与主脚本进行通信。
关于javascript - 火狐插件 SDK : Babel support,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34591765/