Javascript 使用字符串作为声明react组件的JS文件

我使用的插件（）允许我从

imports

编辑完整的JS文件，直到组件声明结束

此编辑器返回包含所有文件声明的字符串。在本例中，它将是：

import React from "react"; import ReactDOM from "react-dom"; function App() { return ( <h1>Hello world</h1> ); } export default App;

从“React”导入React；从“react dom”导入react dom；函数App（）{return（Hello world）；}导出默认应用程序；

是否有一种方法可以将此字符串用作代码。我的意思是，渲染它，或者像读取普通文件一样读取它

我已经尝试过了，但它只适用于是组件的字符串，而不适用于完整的JS文件。

尝试使用

eval（）

将运行其输入（类型字符串），就像它是程序的一部分一样：

string = "import React from 'react'; import ReactDOM from 'react-dom'; function App() { return ( <h1>Hello world</h1> ); } export default App;";
eval(string);

string=“import React from'React'；import ReactDOM from'React dom'；function App（）{return（Hello world）；}export default App；”；
eval（字符串）；

---

您会注意到，MDN文档包含一条警告，出于安全原因，请勿使用

eval

。这是因为它使用用户授予网页的所有权限执行代码，因此，如果有人可能修改了字符串，那么他们可以在客户端设备上运行他们想要的任何代码。不过，这只是某些用例的问题，可能不是您的问题。看见由于代码必须编译，因此速度也有点慢，但对于您的示例来说，这并不是很明显。

谢谢您的说明。我应该尽可能地保护它。而且eval看起来不是最安全的选择。