Question

电子3.0.0-beta.1 节点10.2.0 铬66.0.3359.181

我遇到的问题是导入模块。我创建了以下协议：

protocol.registerFileProtocol('client', (request, callback) => {
    var url = request.url.substr(8);
    callback({path: path.join(__dirname, url)});
});

协议的输出是正确的路径

"/Users/adviner/Projects/Client/src/ClientsApp/app.js"

我有以下带有以下代码的app.js模块：

export function square() {
    return 'hello';
}

在我的index.html中，我像这样导入模块：

    <script type="module" >
        import square from 'client://app.js';
        console.log(square());
    </script>

但我不断收到错误消息：

app.js /：1无法加载模块脚本：服务器以非JavaScript MIME类型“”响应。根据HTML规范对模块脚本强制执行严格的MIME类型检查。

我已经完成搜索，但似乎找不到解决方案。谁能建议我可以完成这项工作的方法？

谢谢

Answer 1

快速解决方案：

=IF(A2<>A3, C2 & " (" & B2 & " from " & A2 & ")", "")

const { protocol } = require( 'electron' )
const nfs = require( 'fs' )
const npjoin = require( 'path' ).join
const es6Path = npjoin( __dirname, 'www' )

protocol.registerStandardSchemes( [ 'es6' ] )

app.on( 'ready', () => {
  protocol.registerBufferProtocol( 'es6', ( req, cb ) => {
    nfs.readFile(
      npjoin( es6Path, req.url.replace( 'es6://', '' ) ),
      (e, b) => { cb( { mimeType: 'text/javascript', data: b } ) }
    )
  })
})

Answer 2

这是一个棘手的问题，我将参考Electron#12011和此GitHub Gist进行更深入的说明，但核心学习是相应的HTML spec不允许通过{{1}导入}（出于XSS的原因）和协议必须定义了mime类型。

您使用file://的文件协议在提供文件时必须设置正确的mime类型。当前，我猜想当您通过client://定义协议时未设置它们，因此您收到了protocol.registerBufferProtocol，上面的要点有一个代码示例，说明了如何实现。

Answer 3

要确认：出于安全原因，此位置在这里。

但是，如果您只是需要进行部署：

在tsconfig.json文件中将"target": "es2015"更改为"target": "es5"

Answer 4

我现在已经做到了：

https://gist.github.com/jogibear9988/3349784b875c7d487bf4f43e3e071612

我的问题是，我还想支持通过无相对路径导入的模块，因此不需要翻译我的代码。

Answer 5

基于旧版Electron的flcoder解决方案。

电子5.0

const {protocol } = require('electron');
protocol.registerSchemesAsPrivileged([{ scheme: 'es6', privileges: { standard: true, secure: true } }]);

app.on('ready', async () => {
  protocol.registerBufferProtocol('es6', (req, cb) => {
    nfs.readFile(
      npjoin(es6Path, req.url.replace('es6://', '')),
      (e, b) => {
        cb({
          mimeType: 'text/javascript',
          data: b,
        });
      },
    );
  });
  await createWindow();
});

注意！路径似乎总是转换为小写

<script type="module" src="es6://path/main.js"></script>

对不起，没有足够的声誉来回答评论。

电子ES6模块导入

5 个答案: