SystemSh0cker/monaco-editor
1
0
Fork 0
mirror of https://github.com/microsoft/monaco-editor.git synced 2025-12-22 15:05:39 +01:00
Code Issues Projects Releases Packages Activity

Update printWidth to 100

Browse source
This commit is contained in:
Alex Dima 2020-09-21 14:31:41 +02:00
parent 365af6fa65
commit c5586a25cf
No known key found for this signature in database
GPG key ID: 6E58D7B045760DA0
24 changed files with 81 additions and 207 deletions
Download patch file Download diff file Expand all files Collapse all files

7
.prettierignore Normal file
View file

@ -0,0 +1,7 @@
/browser-esm-parcel/.cache/
/browser-esm-parcel/dist/
/browser-esm-webpack/dist/*.js
/browser-esm-webpack-monaco-plugin/dist/*.js
/browser-esm-webpack-small/dist/*.js
/browser-esm-webpack-typescript/dist/*.js
/browser-esm-webpack-typescript-react/dist/*.js

3
.prettierrc
View file

@ -3,5 +3,6 @@
"singleQuote": true, "singleQuote": true,
"trailingComma": "none", "trailingComma": "none",
"semi": true, "semi": true,
"useTabs": true "useTabs": true,
"printWidth": 100
} }

18
browser-amd-diff-editor/index.html
View file

@ -5,23 +5,16 @@
</head> </head>
<body> <body>
<h2>Monaco Diff Editor Sample</h2> <h2>Monaco Diff Editor Sample</h2>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid grey"
></div>
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script> <script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
<script> <script>
require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } }); require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
require(['vs/editor/editor.main'], function () { require(['vs/editor/editor.main'], function () {
var diffEditor = monaco.editor.createDiffEditor( var diffEditor = monaco.editor.createDiffEditor(document.getElementById('container'));
document.getElementById('container')
);
Promise.all([xhr('original.txt'), xhr('modified.txt')]).then(function ( Promise.all([xhr('original.txt'), xhr('modified.txt')]).then(function (r) {
r
) {
var originalTxt = r[0].responseText; var originalTxt = r[0].responseText;
var modifiedTxt = r[1].responseText; var modifiedTxt = r[1].responseText;
@ -44,10 +37,7 @@
} }
if (req.readyState === 4) { if (req.readyState === 4) {
if ( if ((req.status >= 200 && req.status < 300) || req.status === 1223) {
(req.status >= 200 && req.status < 300) ||
req.status === 1223
) {
c(req); c(req);
} else { } else {
e(req); e(req);

20
browser-amd-editor/index.html
View file

@ -6,10 +6,7 @@
</head> </head>
<body> <body>
<h2>Monaco Editor Sample</h2> <h2>Monaco Editor Sample</h2>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid grey"
></div>
<!-- OR ANY OTHER AMD LOADER HERE INSTEAD OF loader.js --> <!-- OR ANY OTHER AMD LOADER HERE INSTEAD OF loader.js -->
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script> <script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
@ -17,17 +14,10 @@
require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } }); require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
require(['vs/editor/editor.main'], function () { require(['vs/editor/editor.main'], function () {
var editor = monaco.editor.create( var editor = monaco.editor.create(document.getElementById('container'), {
document.getElementById('container'), value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
{ language: 'javascript'
value: [ });
'function x() {',
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript'
}
);
}); });
</script> </script>
</body> </body>

15
browser-amd-iframe/inner.html
View file

@ -20,17 +20,10 @@
require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } }); require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
require(['vs/editor/editor.main'], function () { require(['vs/editor/editor.main'], function () {
var editor = monaco.editor.create( var editor = monaco.editor.create(document.getElementById('container'), {
document.getElementById('container'), value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
{ language: 'javascript'
value: [ });
'function x() {',
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript'
}
);
window.onresize = function () { window.onresize = function () {
editor.layout(); editor.layout();

20
browser-amd-localized/index.html
View file

@ -5,10 +5,7 @@
</head> </head>
<body> <body>
<h2>Monaco Editor Localization Sample</h2> <h2>Monaco Editor Localization Sample</h2>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid grey"
></div>
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script> <script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
<script> <script>
@ -23,17 +20,10 @@
}); });
require(['vs/editor/editor.main'], function () { require(['vs/editor/editor.main'], function () {
var editor = monaco.editor.create( var editor = monaco.editor.create(document.getElementById('container'), {
document.getElementById('container'), value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
{ language: 'javascript'
value: [ });
'function x() {',
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript'
}
);
}); });
</script> </script>
</body> </body>

18
browser-amd-monarch/index.html
View file

@ -5,10 +5,7 @@
</head> </head>
<body> <body>
<h2>Monarch Tokenizer Sample</h2> <h2>Monarch Tokenizer Sample</h2>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid grey"
></div>
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script> <script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
<script> <script>
@ -41,14 +38,11 @@
] ]
}); });
var editor = monaco.editor.create( var editor = monaco.editor.create(document.getElementById('container'), {
document.getElementById('container'), theme: 'myCoolTheme',
{ value: getCode(),
theme: 'myCoolTheme', language: 'myCustomLanguage'
value: getCode(), });
language: 'myCustomLanguage'
}
);
}); });
function getCode() { function getCode() {

20
browser-amd-requirejs/index.html
View file

@ -5,10 +5,7 @@
</head> </head>
<body> <body>
<h2>Monaco Editor Sample - Loading with requirejs</h2> <h2>Monaco Editor Sample - Loading with requirejs</h2>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid grey"
></div>
<script <script
src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.5/require.min.js" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.5/require.min.js"
@ -19,17 +16,10 @@
require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } }); require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
require(['vs/editor/editor.main'], function () { require(['vs/editor/editor.main'], function () {
var editor = monaco.editor.create( var editor = monaco.editor.create(document.getElementById('container'), {
document.getElementById('container'), value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
{ language: 'javascript'
value: [ });
'function x() {',
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript'
}
);
}); });
</script> </script>
</body> </body>

9
browser-amd-shadow-dom/index.html
View file

@ -14,10 +14,7 @@
</head> </head>
<body> <body>
<h2>Monaco Editor Sample</h2> <h2>Monaco Editor Sample</h2>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid grey"
></div>
<!-- OR ANY OTHER AMD LOADER HERE INSTEAD OF loader.js --> <!-- OR ANY OTHER AMD LOADER HERE INSTEAD OF loader.js -->
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script> <script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
@ -44,9 +41,7 @@
require(['vs/editor/editor.main'], function () { require(['vs/editor/editor.main'], function () {
const editor = monaco.editor.create(innerContainer, { const editor = monaco.editor.create(innerContainer, {
value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join( value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
'\n'
),
language: 'javascript' language: 'javascript'
}); });
}); });

28
browser-amd-shared-model/index.html
View file

@ -5,14 +5,8 @@
</head> </head>
<body> <body>
<h2>Monaco Editor Shared Models Sample</h2> <h2>Monaco Editor Shared Models Sample</h2>
<div <div id="container1" style="width: 400px; height: 200px; border: 1px solid grey"></div>
id="container1" <div id="container2" style="width: 400px; height: 200px; border: 1px solid grey"></div>
style="width: 400px; height: 200px; border: 1px solid grey"
></div>
<div
id="container2"
style="width: 400px; height: 200px; border: 1px solid grey"
></div>
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script> <script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
<script> <script>
@ -23,18 +17,12 @@
['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'), ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
'javascript' 'javascript'
); );
var editor1 = monaco.editor.create( var editor1 = monaco.editor.create(document.getElementById('container1'), {
document.getElementById('container1'), model: model
{ });
model: model var editor2 = monaco.editor.create(document.getElementById('container2'), {
} model: model
); });
var editor2 = monaco.editor.create(
document.getElementById('container2'),
{
model: model
}
);
}); });
</script> </script>
</body> </body>

5
browser-esm-parcel/src/index.html
View file

@ -4,10 +4,7 @@
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body> <body>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid #ccc"
></div>
<script src="index.js"></script> <script src="index.js"></script>
</body> </body>

5
browser-esm-webpack-small/dist/index.html vendored
View file

@ -4,10 +4,7 @@
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body> <body>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid #ccc"
></div>
<script src="./app.bundle.js"></script> <script src="./app.bundle.js"></script>
</body> </body>

24
browser-esm-webpack-small/generate-imports.js
View file

@ -27,9 +27,7 @@ function getBasicLanguages() {
resolve( resolve(
files.map((file) => { files.map((file) => {
return file return file.substring('./node_modules/monaco-editor/esm/'.length).replace(/\.js$/, '');
.substring('./node_modules/monaco-editor/esm/'.length)
.replace(/\.js$/, '');
}) })
); );
} }
@ -53,14 +51,8 @@ function getAdvancedLanguages() {
resolve( resolve(
files files
.map((file) => .map((file) => file.substring('./node_modules/monaco-editor/esm/vs/language/'.length))
file.substring( .map((file) => file.substring(0, file.length - '/monaco.contribution.js'.length))
'./node_modules/monaco-editor/esm/vs/language/'.length
)
)
.map((file) =>
file.substring(0, file.length - '/monaco.contribution.js'.length)
)
.map((lang) => `vs/language/${lang}/monaco.contribution`) .map((lang) => `vs/language/${lang}/monaco.contribution`)
); );
} }
@ -115,18 +107,12 @@ function generateFeatures() {
const files = const files =
fs fs
.readFileSync( .readFileSync(
path.join( path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/edcore.main.js')
__dirname,
'../node_modules/monaco-editor/esm/vs/editor/edcore.main.js'
)
) )
.toString() + .toString() +
fs fs
.readFileSync( .readFileSync(
path.join( path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/editor.all.js')
__dirname,
'../node_modules/monaco-editor/esm/vs/editor/editor.all.js'
)
) )
.toString(); .toString();
files.split(/\r\n|\n/).forEach((line) => { files.split(/\r\n|\n/).forEach((line) => {

4
browser-esm-webpack-typescript-react/src/components/Editor.tsx
View file

@ -26,9 +26,7 @@ export const Editor: React.FC = () => {
useEffect(() => { useEffect(() => {
if (divEl.current) { if (divEl.current) {
editor = monaco.editor.create(divEl.current, { editor = monaco.editor.create(divEl.current, {
value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join( value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
'\n'
),
language: 'typescript' language: 'typescript'
}); });
} }

10
browser-esm-webpack-typescript-react/webpack.config.js
View file

@ -34,14 +34,8 @@ module.exports = {
{ {
loader: require.resolve('babel-loader'), loader: require.resolve('babel-loader'),
options: { options: {
presets: [ presets: ['@babel/preset-env', '@babel/preset-typescript', '@babel/preset-react'],
'@babel/preset-env', plugins: [isDevelopment && require.resolve('react-refresh/babel')].filter(Boolean)
'@babel/preset-typescript',
'@babel/preset-react'
],
plugins: [
isDevelopment && require.resolve('react-refresh/babel')
].filter(Boolean)
} }
} }
] ]

5
browser-esm-webpack/dist/index.html vendored
View file

@ -4,10 +4,7 @@
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body> <body>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid #ccc"
></div>
<script src="./app.bundle.js"></script> <script src="./app.bundle.js"></script>
</body> </body>

9
browser-script-editor/index.html
View file

@ -10,10 +10,7 @@
</head> </head>
<body> <body>
<h2>Monaco Editor Sync Loading Sample</h2> <h2>Monaco Editor Sync Loading Sample</h2>
<div <div id="container" style="width: 800px; height: 600px; border: 1px solid grey"></div>
id="container"
style="width: 800px; height: 600px; border: 1px solid grey"
></div>
<script> <script>
var require = { paths: { vs: '../node_modules/monaco-editor/min/vs' } }; var require = { paths: { vs: '../node_modules/monaco-editor/min/vs' } };
@ -24,9 +21,7 @@
<script> <script>
var editor = monaco.editor.create(document.getElementById('container'), { var editor = monaco.editor.create(document.getElementById('container'), {
value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join( value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
'\n'
),
language: 'javascript' language: 'javascript'
}); });
</script> </script>

26
electron-amd-nodeIntegration/electron-index.html
View file

@ -4,16 +4,13 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta <meta
http-equiv="Content-Security-Policy" http-equiv="Content-Security-Policy"
content="default-src 'none'; script-src file: 'sha256-TtwXDwNf27AqcsOrUpfkC3hkt80RRVrp7Xlab9b0ZVk='; style-src 'unsafe-inline' file:; font-src file:" content="default-src 'none'; script-src file: 'sha256-RtE3AqQ1tBhtcwykhJsEKY7jjCqiGy5yH1mRDwu6gEE='; style-src 'unsafe-inline' file:; font-src file:"
/> />
<title>Monaco Editor!</title> <title>Monaco Editor!</title>
</head> </head>
<body> <body>
<h1>Monaco Editor in Electron!</h1> <h1>Monaco Editor in Electron!</h1>
<div <div id="container" style="width: 500px; height: 300px; border: 1px solid #ccc"></div>
id="container"
style="width: 500px; height: 300px; border: 1px solid #ccc"
></div>
</body> </body>
<script> <script>
@ -32,26 +29,17 @@
} }
amdRequire.config({ amdRequire.config({
baseUrl: uriFromPath( baseUrl: uriFromPath(path.join(__dirname, '../node_modules/monaco-editor/min'))
path.join(__dirname, '../node_modules/monaco-editor/min')
)
}); });
// workaround monaco-css not understanding the environment // workaround monaco-css not understanding the environment
self.module = undefined; self.module = undefined;
amdRequire(['vs/editor/editor.main'], function () { amdRequire(['vs/editor/editor.main'], function () {
var editor = monaco.editor.create( var editor = monaco.editor.create(document.getElementById('container'), {
document.getElementById('container'), value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
{ language: 'javascript'
value: [ });
'function x() {',
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript'
}
);
}); });
})(); })();
</script> </script>

4
electron-amd-nodeIntegration/index.html
View file

@ -7,9 +7,7 @@
<h2>Monaco Editor Electron Sample</h2> <h2>Monaco Editor Electron Sample</h2>
To run this sample, you need to To run this sample, you need to
<a href="https://github.com/electron/electron/releases" <a href="https://github.com/electron/electron/releases">download Electron</a>
>download Electron</a
>
and then execute: and then execute:
<pre> <pre>

20
electron-amd/electron-index.html
View file

@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta <meta
http-equiv="Content-Security-Policy" http-equiv="Content-Security-Policy"
content="default-src 'none'; script-src file: 'sha256-eUe9D+bk6Fb37s7QPlaxhnIImIQEcnZ1gE7aRcB3yOM='; style-src 'unsafe-inline' file:; font-src file:" content="default-src 'none'; script-src file: 'sha256-AcqnkP3xWRYJaQ27hijK3b831+qsxvzEoSYt6PfGrRE='; style-src 'unsafe-inline' file:; font-src file:"
/> />
<title>Monaco Editor!</title> <title>Monaco Editor!</title>
<style> <style>
@ -18,9 +18,8 @@
<body> <body>
<h1>Monaco Editor in Electron (without nodeIntegration)!</h1> <h1>Monaco Editor in Electron (without nodeIntegration)!</h1>
Note: Since Electron without nodeIntegration is very similar to a browser, Note: Since Electron without nodeIntegration is very similar to a browser, you can have a look
you can have a look at all the other `browser-` samples, as they should work at all the other `browser-` samples, as they should work just fine. <br /><br />
just fine. <br /><br />
<div id="container"></div> <div id="container"></div>
</body> </body>
@ -29,15 +28,10 @@
require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } }); require.config({ paths: { vs: '../node_modules/monaco-editor/min/vs' } });
require(['vs/editor/editor.main'], function () { require(['vs/editor/editor.main'], function () {
const editor = monaco.editor.create( const editor = monaco.editor.create(document.getElementById('container'), {
document.getElementById('container'), value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
{ language: 'javascript'
value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join( });
'\n'
),
language: 'javascript'
}
);
}); });
</script> </script>
</html> </html>

4
electron-amd/index.html
View file

@ -7,9 +7,7 @@
<h2>Monaco Editor Electron Sample</h2> <h2>Monaco Editor Electron Sample</h2>
To run this sample, you need to To run this sample, you need to
<a href="https://github.com/electron/electron/releases" <a href="https://github.com/electron/electron/releases">download Electron</a>
>download Electron</a
>
and then execute: and then execute:
<pre> <pre>

4
nwjs-amd-v2/index.html
View file

@ -48,9 +48,7 @@
self.process.browser = true; self.process.browser = true;
ERequire(['vs/editor/editor.main'], function () { ERequire(['vs/editor/editor.main'], function () {
var editor = monaco.editor.create(document.getElementById('container'), { var editor = monaco.editor.create(document.getElementById('container'), {
value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join( value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
'\n'
),
language: 'javascript', language: 'javascript',
theme: 'vs-dark' theme: 'vs-dark'
}); });

9
nwjs-amd/index.html
View file

@ -11,10 +11,7 @@
</head> </head>
<body> <body>
<h1>Hello World!</h1> <h1>Hello World!</h1>
<div <div id="container" style="width: 500px; height: 300px; border: 1px solid #ccc"></div>
id="container"
style="width: 500px; height: 300px; border: 1px solid #ccc"
></div>
</body> </body>
<script> <script>
@ -43,9 +40,7 @@
amdRequire(['vs/editor/editor.main'], function () { amdRequire(['vs/editor/editor.main'], function () {
var editor = monaco.editor.create(document.getElementById('container'), { var editor = monaco.editor.create(document.getElementById('container'), {
value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join( value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
'\n'
),
language: 'javascript' language: 'javascript'
}); });
}); });

1
package.json
View file

@ -4,6 +4,7 @@
"description": "Samples for using the Monaco Editor", "description": "Samples for using the Monaco Editor",
"main": "index.js", "main": "index.js",
"scripts": { "scripts": {
"prettier": "prettier --write .",
"simpleserver": "yaserver --root ./ --port 8888" "simpleserver": "yaserver --root ./ --port 8888"
}, },
"author": "Microsoft Corporation", "author": "Microsoft Corporation",