如何在monaco编辑器中为intellisense定义全局变量

Question

我集成了monaco编辑器，用来编写简单的代码片段。

我想让typescript变量在这个片段中全局可用，并为其提供工作智能

我正在使用以下代码加载打字脚本：

const typings = await fetch(path).then(r => r.text());
monaco.languages.typescript.javascriptDefaults.addExtraLib(typings, path);

但显然，如果没有任何额外的想法，这是行不通的。因为typescript打字是作为模块创建的，并且不向全局公开任何内容。

我可以用这样的东西创建一个全局变量：

monaco.languages.typescript.javascriptDefaults.addExtraLib(`
declare const typescript: any;
`, 'global.d.ts');

但是我不能为这个变量指定typescript类型。我试过这个

monaco.languages.typescript.javascriptDefaults.addExtraLib(typings, './typescript.d.ts');
monaco.languages.typescript.javascriptDefaults.addExtraLib(`
import * as ts from './typescript.d.ts';
declare global {
const typescript: typeof ts;
}
`, 'global.d.ts');
});

但运气不好。它不起作用。

如何将模块公开为全局变量？

Answer 1

我不熟悉Monaco集成，但当我手动将代码添加到TypeScript项目时，我遇到了一个错误："导入路径不能以'.d.ts'扩展名结束。请考虑导入'./TypeScript'。"在我进行更改后，我可以使用typescript全局变量。

但是，这种方法只能访问typescript中的常量和函数，而不能访问typescript.SourceFile等类型。要做到这一点，请尝试以下操作：

monaco.languages.typescript.javascriptDefaults.addExtraLib(`
import * as ts from './typescript';
export = ts;
export as namespace typescript;
`, 'global.d.ts');

或者，直接用monkeypatch键入TypeScript：

monaco.languages.typescript.javascriptDefaults.addExtraLib(
typings + "nexport as namespace typescript;", path);

Answer 2

这项工作也是纯js

///---Webpack.cfg.js---
var fs = require('fs');
var MonacoEditorPlugin = require('monaco-editor-webpack-plugin')
...plugins.push(
new MonacoEditorPlugin({            
languages: ['typescript', 'javascript', 'css', 'html', 'json', 'less']
/// typescript - Require !
})
)
let MYDTS = [
fs.readFileSync('./globals.d.ts'),
fs.readFileSync('./src/js/RuntimeDeclare.d.ts'),//some modules 
'declare function myFunc(modulename:String): String;', //inline
]
.join(';n')
.replace(/export declare/g, 'declare')
.replace(/export interface/g, 'interface')
.replace(/export type/g, 'type');// 'export'is not recognize, so remove
//import won't work, you need to do it in expanded form
//---In front js---
// validation settings
monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({
noSemanticValidation: true,
noSyntaxValidation: false
});
// compiler options
monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
target: monaco.languages.typescript.ScriptTarget.ES6,
allowNonTsExtensions: true,
allowJs: true,//!!!Require for js
});
monaco.languages.typescript.javascriptDefaults.addExtraLib(
MYDTS, 'ts:filename/MYDTS.d.ts');
monaco.editor.create(....