p96170835
/
amis
1
0
Fork 1
Code Issues Pull Requests Releases Wiki Activity

monaco-editor 改成 esm 版本

This commit is contained in:
2betop 2020-01-20 18:50:01 +08:00
parent a116cab6d8
commit 7ef5a9f810
3 changed files with 634 additions and 869 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

331
fis-conf.js
View File

@ -4,11 +4,7 @@
const path = require('path');
const package = require('./package.json');
const parserMarkdown = require('./build/md-parser');
fis.get('project.ignore').push(
'public/**',
'gh-pages/**',
'.*/**'
);
fis.get('project.ignore').push('public/**', 'gh-pages/**', '.*/**');
// 配置只编译哪些文件。
fis.set('project.files', [
@ -42,7 +38,7 @@ fis.match('/src/icons/**.svg', {
parser: [
fis.plugin('svgr', {
svgProps: {
className: "icon"
className: 'icon'
},
prettier: false,
dimensions: false
@ -54,7 +50,7 @@ fis.match('/src/icons/**.svg', {
sourceMap: false
})
]
})
});
fis.match('_*.scss', {
release: false
@ -66,8 +62,14 @@ fis.match('/node_modules/**.js', {
fis.match('/docs/**.md', {
rExt: 'js',
parser: [parserMarkdown, function(contents, file) {
return contents.replace(/\bhref=\\('|")(.+?)\\\1/g, function(_, quota, link) {
parser: [
parserMarkdown,
function(contents, file) {
return contents.replace(/\bhref=\\('|")(.+?)\\\1/g, function(
_,
quota,
link
) {
if (/\.md($|#)/.test(link) && !/^https?\:/.test(link)) {
let parts = link.split('#');
parts[0] = parts[0].replace('.md', '');
@ -81,27 +83,40 @@ fis.match('/docs/**.md', {
return _;
});
}],
}
],
isMod: true
});
fis.on('compile:parser', function (file) {
fis.on('compile:parser', function(file) {
if (file.subpath === '/src/index.tsx') {
file.setContent(file.getContent().replace('@version', package.version));
}
});
fis.match('monaco-editor/esm/**.js', {
parser: fis.plugin('typescript', {
importHelpers: true,
esModuleInterop: true,
experimentalDecorators: true,
sourceMap: false
}),
preprocessor: fis.plugin('js-require-css')
});
fis.match('{*.ts,*.jsx,*.tsx,/src/**.js,/src/**.ts}', {
parser: [fis.plugin('typescript', {
parser: [
fis.plugin('typescript', {
importHelpers: true,
esModuleInterop: true,
experimentalDecorators: true,
sourceMap: true
}),
function (content) {
return content.replace(/\b[a-zA-Z_0-9$]+\.__uri\s*\(/g, '__uri(')
}],
function(content) {
return content.replace(/\b[a-zA-Z_0-9$]+\.__uri\s*\(/g, '__uri(');
}
],
preprocessor: fis.plugin('js-require-css'),
isMod: true,
rExt: '.js'
@ -113,33 +128,6 @@ fis.match('*.html:jsx', {
isMod: false
});
fis.match('monaco-editor/**.js', {
isMod: false,
standard: null
});
fis.match('/node_modules/monaco-editor/min/(**)', {
standard: false,
isMod: false,
packTo: null,
optimizer: false,
postprocessor: function (content, file) {
if (!file.isJsLike || /worker/.test(file.basename)) {
return content;
}
content = content.replace(/\bself\.require\b/g, 'require || self.require');
return '(function(define, require) {\n' + content
+ '\n})(this.monacaAmd && this.monacaAmd.define || this.define, this.monacaAmd && this.monacaAmd.require);';
}
});
fis.match('/node_modules/monaco-editor/min/**/loader.js', {
postprocessor: function (content) {
return '(function(self) {\n' + content + '\n}).call(this.monacaAmd || (this.monacaAmd = {}));';
}
});
fis.hook('node_modules', {
shimProcess: false,
shimGlobal: false,
@ -150,31 +138,36 @@ fis.hook('commonjs', {
});
fis.match('::package', {
prepackager: fis.plugin('stand-alone-pack', {
'/pkg/editor.worker.js': 'monaco-editor/esm/vs/editor/editor.worker.js',
'/pkg/json.worker.js': 'monaco-editor/esm/vs/language/json/json.worker',
'/pkg/css.worker.js': 'monaco-editor/esm/vs/language/css/css.worker',
'/pkg/html.worker.js': 'monaco-editor/esm/vs/language/html/html.worker',
'/pkg/ts.worker.js': 'monaco-editor/esm/vs/language/typescript/ts.worker',
// 替换这些文件里面的路径引用。
// 如果不配置，源码中对于打包文件的引用是不正确的。
'replaceFiles': ['src/components/Editor.tsx']
}),
postpackager: fis.plugin('loader', {
useInlineMap: false,
resourceType: 'mod'
})
})
});
fis
.media('dev')
.match('/node_modules/**.js', {
fis.match('*.worker.js', {
useHash: true
});
fis.media('dev').match('/node_modules/**.js', {
packTo: '/pkg/npm.js'
})
.match('monaco-editor/**.js', {
packTo: null
});
});
if (fis.project.currentMedia() === 'publish') {
const publishEnv = fis.media('publish');
publishEnv.get('project.ignore').push(
'lib/**'
);
publishEnv.set('project.files', [
'/scss/**',
'/src/**'
]);
publishEnv.get('project.ignore').push('lib/**');
publishEnv.set('project.files', ['/scss/**', '/src/**']);
publishEnv.match('/scss/(**)', {
release: '/$1',
@ -186,10 +179,6 @@ if (fis.project.currentMedia() === 'publish') {
relative: true
});
publishEnv.match('/node_modules/monaco-editor/min/(**)', {
release: '/thirds/monaco-editor/$1'
});
publishEnv.match('/src/**.{jsx,tsx,js,ts}', {
parser: [
fis.plugin('typescript', {
@ -198,11 +187,20 @@ if (fis.project.currentMedia() === 'publish') {
experimentalDecorators: true,
esModuleInterop: true
}),
function (contents) {
return contents.replace(/(?:\w+\.)?\b__uri\s*\(\s*('|")(.*?)\1\s*\)/g, function (_, quote, value) {
function(contents) {
return contents.replace(
/(?:\w+\.)?\b__uri\s*\(\s*('|")(.*?)\1\s*\)/g,
function(_, quote, value) {
let str = quote + value + quote;
return '(function(){try {return __uri(' + str + ')} catch(e) {return ' + str + '}})()';
});
return (
'(function(){try {return __uri(' +
str +
')} catch(e) {return ' +
str +
'}})()'
);
}
);
}
]
});
@ -226,18 +224,23 @@ if (fis.project.currentMedia() === 'publish') {
});
publishEnv.match('/src/**.{jsx,tsx,js,ts}', {
postprocessor: function (content, file) {
return content.replace(/^''/mg, '').replace(/\/\/# sourceMappingURL=\//g, '//# sourceMappingURL=./');
postprocessor: function(content, file) {
return content
.replace(/^''/gm, '')
.replace(/\/\/# sourceMappingURL=\//g, '//# sourceMappingURL=./');
}
});
publishEnv.match('*.scss', {
postprocessor: function (content, file) {
return content.replace(/\/\*# sourceMappingURL=\//g, '/*# sourceMappingURL=./');
postprocessor: function(content, file) {
return content.replace(
/\/\*# sourceMappingURL=\//g,
'/*# sourceMappingURL=./'
);
}
});
publishEnv.match('::package', {
postpackager: function (ret) {
Object.keys(ret.src).forEach(function (subpath) {
postpackager: function(ret) {
Object.keys(ret.src).forEach(function(subpath) {
var file = ret.src[subpath];
if (!file.isText()) {
return;
@ -247,17 +250,25 @@ if (fis.project.currentMedia() === 'publish') {
content = content
.replace('require("node_modules/tslib/tslib")', 'require("tslib")')
.replace('require("node_modules/react/index")', 'require("react")')
.replace('require("node_modules/classnames/index")', 'require("classnames")')
.replace('require("src/themes/default.ts")', 'require("../themes/default.js")')
.replace(
'require("node_modules/classnames/index")',
'require("classnames")'
)
.replace(
'require("src/themes/default.ts")',
'require("../themes/default.js")'
)
.replace('require("src/theme.tsx")', 'require("../theme.js")')
.replace(/('|")(\.\.\/thirds.*?)\1/g, function (_, quote, value) {
.replace(/('|")(\.\.\/thirds.*?)\1/g, function(_, quote, value) {
return '__uri(' + quote + value + quote + ')';
});
} else if (subpath === '/src/components/icons.tsx') {
content = content
.replace(/\.svg/g, ".js")
content = content.replace(/\.svg/g, '.js');
} else {
content = content.replace(/@require\s+(?:\.\.\/)?node_modules\//g, '@require ');
content = content.replace(
/@require\s+(?:\.\.\/)?node_modules\//g,
'@require '
);
}
file.setContent(content);
});
@ -268,15 +279,11 @@ if (fis.project.currentMedia() === 'publish') {
} else if (fis.project.currentMedia() === 'publish-sdk') {
const env = fis.media('publish-sdk');
env.get('project.ignore').push(
'sdk/**'
);
env.set('project.files', [
'examples/sdk-placeholder.html'
]);
env.get('project.ignore').push('sdk/**');
env.set('project.files', ['examples/sdk-placeholder.html']);
env.match('/{examples,scss}/(**)', {
release: '/$1',
release: '/$1'
});
env.match('*.map', {
@ -291,10 +298,6 @@ if (fis.project.currentMedia() === 'publish') {
release: '/thirds/$1/$2'
});
env.match('/node_modules/monaco-editor/min/(**)', {
release: '/thirds/monaco-editor/$1'
});
env.match('*.scss', {
parser: fis.plugin('node-sass', {
sourceMap: false
@ -302,16 +305,18 @@ if (fis.project.currentMedia() === 'publish') {
});
env.match('{*.ts,*.jsx,*.tsx,/src/**.js,/src/**.ts}', {
parser: [fis.plugin('typescript', {
parser: [
fis.plugin('typescript', {
importHelpers: true,
esModuleInterop: true,
experimentalDecorators: true,
sourceMap: false
}),
function (content) {
return content.replace(/\b[a-zA-Z_0-9$]+\.__uri\s*\(/g, '__uri(')
}],
function(content) {
return content.replace(/\b[a-zA-Z_0-9$]+\.__uri\s*\(/g, '__uri(');
}
],
preprocessor: fis.plugin('js-require-css'),
isMod: true,
rExt: '.js'
@ -323,16 +328,16 @@ if (fis.project.currentMedia() === 'publish') {
env.match('*.{js,jsx,ts,tsx}', {
optimizer: fis.plugin('uglify-js'),
moduleId: function (m, path) {
moduleId: function(m, path) {
return fis.util.md5('amis-sdk' + path);
},
}
});
env.match('/src/icons/**.svg', {
optimizer: fis.plugin('uglify-js'),
moduleId: function (m, path) {
moduleId: function(m, path) {
return fis.util.md5('amis-sdk' + path);
},
}
});
env.match('src/components/Editor.tsx', {
@ -353,18 +358,20 @@ if (fis.project.currentMedia() === 'publish') {
'!jquery/**',
'!zrender/**',
'!echarts/**',
'!docsearch.js/**',
'!docsearch.js/**'
],
'rich-text.js': [
'src/components/RichText.tsx',
'froala-editor/**',
'jquery/**',
'jquery/**'
],
'echarts.js': [
'zrender/**',
'echarts/**',
'echarts.js': ['zrender/**', 'echarts/**'],
'monaco-editor.js': [
'monaco-editor/esm/vs/editor/editor.main.js',
'monaco-editor/esm/vs/editor/editor.main.js:deps'
],
'rest.js': [
@ -376,8 +383,8 @@ if (fis.project.currentMedia() === 'publish') {
'!src/components/RichText.tsx',
'!jquery/**',
'!zrender/**',
'!echarts/**',
],
'!echarts/**'
]
}),
postpackager: [
fis.plugin('loader', {
@ -389,19 +396,13 @@ if (fis.project.currentMedia() === 'publish') {
]
});
env.match('monaco-editor/**.js', {
isMod: false,
standard: null,
optimizer: null,
packTo: null
});
fis.on('compile:optimizer', function (file) {
fis.on('compile:optimizer', function(file) {
if (file.isJsLike && file.isMod) {
var contents = file.getContent();
if (file.subpath === '/src/components/Editor.tsx') {
contents = contents.replace(/function\snoJsExt\(raw\)\s\{/, function() {
contents = contents
.replace(/function\snoJsExt\(raw\)\s\{/, function() {
return `var _path = '';
try {
throw new Error()
@ -415,10 +416,16 @@ if (fis.project.currentMedia() === 'publish') {
});
}
if (typeof contents === 'string' && contents.substring(0, 7) === 'define(') {
if (
typeof contents === 'string' &&
contents.substring(0, 7) === 'define('
) {
contents = 'amis.' + contents;
contents = contents.replace('function(require, exports, module)', 'function(require, exports, module, define)');
contents = contents.replace(
'function(require, exports, module)',
'function(require, exports, module, define)'
);
file.setContent(contents);
}
@ -464,8 +471,14 @@ if (fis.project.currentMedia() === 'publish') {
rExt: 'js',
isMod: true,
useHash: true,
parser: [parserMarkdown, function(contents, file) {
return contents.replace(/\bhref=\\('|")(.+?)\\\1/g, function(_, quota, link) {
parser: [
parserMarkdown,
function(contents, file) {
return contents.replace(/\bhref=\\('|")(.+?)\\\1/g, function(
_,
quota,
link
) {
if (/\.md($|#)/.test(link) && !/^https?\:/.test(link)) {
let parts = link.split('#');
parts[0] = parts[0].replace('.md', '');
@ -479,7 +492,8 @@ if (fis.project.currentMedia() === 'publish') {
return _;
});
}],
}
]
});
ghPages.match('/node_modules/(**)', {
@ -497,14 +511,24 @@ if (fis.project.currentMedia() === 'publish') {
}
return contents
.replace(/(\\?(?:'|"))((?:get|post|delete|put)\:)?\/api\/mock2?/ig, function(_, qutoa, method) {
return qutoa + (method || '') + 'https://houtai.baidu.com/api/mock2';
})
.replace(/(\\?(?:'|"))((?:get|post|delete|put)\:)?\/api\/sample/ig, function(_, qutoa, method) {
return qutoa + (method || '') + 'https://houtai.baidu.com/api/sample';
});
.replace(
/(\\?(?:'|"))((?:get|post|delete|put)\:)?\/api\/mock2?/gi,
function(_, qutoa, method) {
return (
qutoa + (method || '') + 'https://houtai.baidu.com/api/mock2'
);
}
})
)
.replace(
/(\\?(?:'|"))((?:get|post|delete|put)\:)?\/api\/sample/gi,
function(_, qutoa, method) {
return (
qutoa + (method || '') + 'https://houtai.baidu.com/api/sample'
);
}
);
}
});
ghPages.match('mock/**.{json,js,conf}', {
release: false
@ -523,24 +547,25 @@ if (fis.project.currentMedia() === 'publish') {
'!amis/lib/components/RichText.js',
'!jquery/**',
'!zrender/**',
'!echarts/**',
'!echarts/**'
],
'pkg/rich-text.js': [
'amis/lib/components/RichText.js',
'froala-editor/**',
'jquery/**'
],
'pkg/echarts.js': [
'zrender/**',
'echarts/**'
],
'pkg/api-mock.js': [
'mock/*.ts'
],
'pkg/echarts.js': ['zrender/**', 'echarts/**'],
'pkg/api-mock.js': ['mock/*.ts'],
'pkg/app.js': [
'/examples/components/App.jsx',
'/examples/components/App.jsx:deps'
],
'pkg/monaco-editor.js': [
'monaco-editor/esm/vs/editor/editor.main.js',
'monaco-editor/esm/vs/editor/editor.main.js:deps'
],
'pkg/rest.js': [
'**.{js,jsx,ts,tsx}',
'!static/mod.js',
@ -552,38 +577,40 @@ if (fis.project.currentMedia() === 'publish') {
'!jquery/**',
'!amis/lib/components/RichText.js',
'!zrender/**',
'!echarts/**',
'!echarts/**'
],
'pkg/npm.css': [
'node_modules/*/**.css',
'!monaco-editor/**',
],
'pkg/npm.css': ['node_modules/*/**.css', '!monaco-editor/**'],
// css 打包
'pkg/style.css': [
'*.scss',
'*.css',
'!monaco-editor/**',
'!/scss/themes/*.scss',
// 要切换主题，不能打在一起。'/scss/*.scss',
'!/examples/style.scss',
'/examples/style.scss', // 让它在最下面
'/examples/style.scss' // 让它在最下面
]
}),
postpackager: [fis.plugin('loader', {
postpackager: [
fis.plugin('loader', {
useInlineMap: false,
resourceType: 'mod'
}), function(ret) {
}),
function(ret) {
const indexHtml = ret.src['/examples/index.html'];
const appJs = ret.src['/examples/components/App.jsx'];
const DocJs = ret.src['/examples/components/Doc.jsx'];
const pages = [];
const source = [appJs.getContent(), DocJs.getContent()].join('\n');
source.replace(/\bpath\b\s*\:\s*('|")(.*?)\1/g, function(_, qutoa, path) {
if (path === "*") {
source.replace(/\bpath\b\s*\:\s*('|")(.*?)\1/g, function(
_,
qutoa,
path
) {
if (path === '*') {
return;
}
@ -593,11 +620,15 @@ if (fis.project.currentMedia() === 'publish') {
const contents = indexHtml.getContent();
pages.forEach(function(path) {
const file = fis.file(fis.project.getProjectPath(), '/examples/' + path + '.html');
const file = fis.file(
fis.project.getProjectPath(),
'/examples/' + path + '.html'
);
file.setContent(contents);
ret.pkg[file.getId()] = file;
});
}]
}
]
});
ghPages.match('*.{css,less,scss}', {
@ -620,7 +651,7 @@ if (fis.project.currentMedia() === 'publish') {
useHash: false
});
ghPages.match('{*.jsx,*.tsx,*.ts}', {
moduleId: function (m, path) {
moduleId: function(m, path) {
return fis.util.md5('amis' + path);
},
parser: fis.plugin('typescript', {
@ -638,11 +669,7 @@ if (fis.project.currentMedia() === 'publish') {
})
]
});
ghPages.match('{*.min.js,monaco-editor/**.js}', {
ghPages.match('{*.min.js}', {
optimizer: null
});
ghPages.match('monaco-editor/(**)', {
useHash: false,
release: '/n/monaco-editor/0.17.1/$1'
});
}

1
package.json
View File

@ -119,6 +119,7 @@
"fis3-parser-typescript": "^1.3.0",
"fis3-postpackager-loader": "^2.1.11",
"fis3-preprocessor-js-require-css": "^0.1.3",
"fis3-prepackager-stand-alone-pack": "^1.0.0",
"font-awesome": "4.7.0",
"fs-walk": "0.0.2",
"highlight.js": "^9.12.0",

307
src/components/Editor.tsx
View File

@ -7,230 +7,28 @@
import React from 'react';
import cx from 'classnames';
import {ClassNamesFn, themeable} from '../theme';
import {__uri} from '../utils/helper';
function noJsExt(raw: string) {
return raw.replace(/\.js$/, '');
}
const defaultConfig = {
'url': 'vs/loader.js',
'vs/nls': {
availableLanguages: {
'*': 'zh-cn'
(window as any).MonacoEnvironment = {
getWorkerUrl: function(moduleId: string, label: string) {
if (label === 'json') {
return '/pkg/json.worker.js';
} else if (label === 'css') {
return '/pkg/css.worker.js';
} else if (label === 'html') {
return '/pkg/html.worker.js';
} else if (label === 'typescript' || label === 'javascript') {
return '/pkg/ts.worker.js';
}
return '/pkg/editor.worker.js';
}
},
'paths': {}
};
try {
// fis 编译的话，能正确赋值上，如果不是，那请通过外部参数传递。
defaultConfig.url = __uri('monaco-editor/min/vs/loader.js');
defaultConfig.paths = {
'vs': noJsExt(__uri('monaco-editor/min/vs/editor/editor.main.js')).replace(
/\/vs\/.*$/,
''
),
'vs/base/worker/workerMain': noJsExt(
__uri('monaco-editor/min/vs/base/worker/workerMain.js')
),
'vs/basic-languages/apex/apex': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/apex/apex')
),
'vs/basic-languages/azcli/azcli': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/azcli/azcli')
),
'vs/basic-languages/clojure/clojure': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/clojure/clojure')
),
'vs/basic-languages/bat/bat': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/bat/bat')
),
'vs/basic-languages/coffee/coffee': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/coffee/coffee')
),
'vs/basic-languages/cpp/cpp': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/cpp/cpp')
),
'vs/basic-languages/csharp/csharp': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/csharp/csharp')
),
'vs/basic-languages/css/css': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/css/css')
),
'vs/basic-languages/dockerfile/dockerfile': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/dockerfile/dockerfile')
),
'vs/basic-languages/fsharp/fsharp': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/fsharp/fsharp')
),
'vs/basic-languages/go/go': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/go/go')
),
'vs/basic-languages/handlebars/handlebars': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/handlebars/handlebars')
),
'vs/basic-languages/html/html': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/html/html')
),
'vs/basic-languages/ini/ini': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/ini/ini')
),
'vs/basic-languages/java/java': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/java/java')
),
'vs/basic-languages/javascript/javascript': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/javascript/javascript')
),
'vs/basic-languages/less/less': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/less/less')
),
'vs/basic-languages/lua/lua': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/lua/lua')
),
'vs/basic-languages/markdown/markdown': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/markdown/markdown')
),
'vs/basic-languages/msdax/msdax': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/msdax/msdax')
),
'vs/basic-languages/objective-c/objective-c': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/objective-c/objective-c')
),
'vs/basic-languages/php/php': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/php/php')
),
'vs/basic-languages/postiats/postiats': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/postiats/postiats')
),
'vs/basic-languages/powershell/powershell': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/powershell/powershell')
),
'vs/basic-languages/pug/pug': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/pug/pug')
),
'vs/basic-languages/python/python': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/python/python')
),
'vs/basic-languages/r/r': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/r/r')
),
'vs/basic-languages/razor/razor': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/razor/razor')
),
'vs/basic-languages/redis/redis': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/redis/redis')
),
'vs/basic-languages/redshift/redshift': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/redshift/redshift')
),
'vs/basic-languages/ruby/ruby': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/ruby/ruby')
),
'vs/basic-languages/rust/rust': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/rust/rust')
),
'vs/basic-languages/sb/sb': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/sb/sb')
),
'vs/basic-languages/scheme/scheme': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/scheme/scheme')
),
'vs/basic-languages/scss/scss': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/scss/scss')
),
'vs/basic-languages/shell/shell': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/shell/shell')
),
'vs/basic-languages/solidity/solidity': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/solidity/solidity')
),
'vs/basic-languages/sql/sql': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/sql/sql')
),
'vs/basic-languages/st/st': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/st/st')
),
'vs/basic-languages/swift/swift': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/swift/swift')
),
'vs/basic-languages/typescript/typescript': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/typescript/typescript')
),
'vs/basic-languages/vb/vb': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/vb/vb')
),
'vs/basic-languages/xml/xml': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/xml/xml')
),
'vs/basic-languages/yaml/yaml': noJsExt(
__uri('monaco-editor/min/vs/basic-languages/yaml/yaml')
),
'vs/editor/editor.main': noJsExt(
__uri('monaco-editor/min/vs/editor/editor.main.js')
),
'vs/editor/editor.main.css': noJsExt(
__uri('monaco-editor/min/vs/editor/editor.main.css')
),
'vs/editor/editor.main.nls': noJsExt(
__uri('monaco-editor/min/vs/editor/editor.main.nls.js')
),
'vs/editor/editor.main.nls.zh-cn': noJsExt(
__uri('monaco-editor/min/vs/editor/editor.main.nls.zh-cn.js')
),
// 'vs/editor/contrib/suggest/media/String_16x.svg': noJsExt(__uri('monaco-editor/min/vs/editor/contrib/suggest/media/String_16x.svg')),
// 'vs/editor/contrib/suggest/media/String_inverse_16x.svg': noJsExt(__uri('monaco-editor/min/vs/editor/contrib/suggest/media/String_inverse_16x.svg')),
// 'vs/editor/standalone/browser/quickOpen/symbol-sprite.svg': noJsExt(__uri('monaco-editor/min/vs/editor/standalone/browser/quickOpen/symbol-sprite.svg')),
'vs/language/typescript/tsMode': noJsExt(
__uri('monaco-editor/min/vs/language/typescript/tsMode.js')
),
// 'vs/language/typescript/lib/typescriptServices': noJsExt(__uri('monaco-editor/min/vs/language/typescript/lib/typescriptServices.js')),
'vs/language/typescript/tsWorker': noJsExt(
__uri('monaco-editor/min/vs/language/typescript/tsWorker.js')
),
'vs/language/json/jsonMode': noJsExt(
__uri('monaco-editor/min/vs/language/json/jsonMode.js')
),
'vs/language/json/jsonWorker': noJsExt(
__uri('monaco-editor/min/vs/language/json/jsonWorker.js')
),
'vs/language/html/htmlMode': noJsExt(
__uri('monaco-editor/min/vs/language/html/htmlMode.js')
),
'vs/language/html/htmlWorker': noJsExt(
__uri('monaco-editor/min/vs/language/html/htmlWorker.js')
),
'vs/language/css/cssMode': noJsExt(
__uri('monaco-editor/min/vs/language/css/cssMode.js')
),
'vs/language/css/cssWorker': noJsExt(
__uri('monaco-editor/min/vs/language/css/cssWorker.js')
)
};
// cdn 支持
/^(https?:)?\/\//.test(defaultConfig.paths.vs) &&
((window as any).MonacoEnvironment = {
getWorkerUrl: function() {
return `data:text/javascript;charset=utf-8,${encodeURIComponent(`
self.MonacoEnvironment = {
baseUrl: '${defaultConfig.paths.vs}',
paths: ${JSON.stringify(defaultConfig.paths)}
};
importScripts('${__uri(
'monaco-editor/min/vs/base/worker/workerMain.js'
)}');`)}`;
}
});
} catch (e) {}
export function monacoFactory(containerElement, monaco, options) {
export function monacoFactory(
containerElement: HTMLElement,
monaco: any,
options: any
) {
return monaco.editor.create(containerElement, {
autoIndent: true,
formatOnType: true,
@ -276,7 +74,6 @@ export interface EditorProps {
export class Editor extends React.Component<EditorProps, any> {
static defaultProps = {
requireConfig: defaultConfig,
language: 'javascript',
editorTheme: 'vs',
width: '100%',
@ -352,69 +149,12 @@ export class Editor extends React.Component<EditorProps, any> {
}
loadMonaco() {
const {requireConfig} = this.props;
const loaderUrl = requireConfig.url || 'vs/loader.js';
const context =
(window as any).monacaAmd ||
((window as any).monacaAmd = {
document: window.document
(require as any)(['monaco-editor'], (monaco: any) => {
this.initMonaco(monaco);
});
const onGotAmdLoader = () => {
if (context.__REACT_MONACO_EDITOR_LOADER_ISPENDING__) {
// Do not use webpack
if (requireConfig.paths && requireConfig.paths.vs) {
context.require.config(requireConfig);
}
}
// Load monaco
context['require'](
['vs/editor/editor.main', 'vs/editor/editor.main.nls.zh-cn'],
() => {
this.initMonaco();
}
);
// Call the delayed callbacks when AMD loader has been loaded
if (context.__REACT_MONACO_EDITOR_LOADER_ISPENDING__) {
context.__REACT_MONACO_EDITOR_LOADER_ISPENDING__ = false;
let loaderCallbacks = context.__REACT_MONACO_EDITOR_LOADER_CALLBACKS__;
if (loaderCallbacks && loaderCallbacks.length) {
let currentCallback = loaderCallbacks.shift();
while (currentCallback) {
currentCallback.fn.call(currentCallback.context);
currentCallback = loaderCallbacks.shift();
}
}
}
};
// Load AMD loader if necessary
if (context.__REACT_MONACO_EDITOR_LOADER_ISPENDING__) {
// We need to avoid loading multiple loader.js when there are multiple editors loading concurrently
// delay to call callbacks except the first one
context.__REACT_MONACO_EDITOR_LOADER_CALLBACKS__ =
context.__REACT_MONACO_EDITOR_LOADER_CALLBACKS__ || [];
context.__REACT_MONACO_EDITOR_LOADER_CALLBACKS__.push({
context: this,
fn: onGotAmdLoader
});
} else {
if (typeof context.require === 'undefined') {
var loaderScript = context.document.createElement('script');
loaderScript.type = 'text/javascript';
loaderScript.src = loaderUrl;
loaderScript.addEventListener('load', onGotAmdLoader);
context.document.body.appendChild(loaderScript);
context.__REACT_MONACO_EDITOR_LOADER_ISPENDING__ = true;
} else {
onGotAmdLoader();
}
}
}
initMonaco() {
initMonaco(monaco: any) {
let value =
this.props.value !== null ? this.props.value : this.props.defaultValue;
const {language, editorTheme, options, editorFactory} = this.props;
@ -422,9 +162,7 @@ export class Editor extends React.Component<EditorProps, any> {
if (!containerElement) {
return;
}
const context = this.props.context || window;
const monaco = context.monaco || (window as any).monaco;
if (typeof monaco !== 'undefined') {
// Before initializing monaco editor
this.editorWillMount(monaco);
@ -459,7 +197,6 @@ export class Editor extends React.Component<EditorProps, any> {
// After initializing monaco editor
this.editorDidMount(this.editor, monaco);
}
}
editorWillMount(monaco: any) {
const {editorWillMount} = this.props;