将 .js 文件作为文本导入并在 React-native expo 中注入 JavaScript 的 WebView 中使用它

Question

我有一个文件content.js，其中包含一些 JavaScript 代码，我想使用injectedJavaScript.

我试过：

    fetch('./content.js').then((result) => {
      result = result.text();
      this.setState(previousState => (
        {contentScript: result}
      ));
    });

但它没有得到正确的文件。

const contentScript = require('./content.js');

这是可行的，但它会立即评估 JavaScript，而且我似乎找不到在执行之前将其转换为字符串的方法。

解决方案是将 的代码复制content.js到字符串中，但是当我想编辑代码时，这会很烦人......

有谁知道更好的解决方案？
我已经快一周了仍然没有解决这个问题。:(

Answer 1

由于 expo 使用webpack，您可以自定义它。Webpack 有一个您可能感兴趣的加载器部分。您需要的加载器称为raw-loader。因此，当您需要某些文件时，webpack 会针对配置中的加载器链运行该文件。默认情况下，所有.js文件都捆绑到index.js您运行应用程序时执行的文件中。相反，您需要确切的文件内容raw-loader。它会插入类似的东西

module.contentScript = function() { return "console.log('Hello world!')"}

代替：

module.contentScript = function() { console.log('Hello World'}}

所以你需要：

npm install raw-loader --save-dev

并在您的代码中：

require('raw-loader!./content.js');