我在這里使用此工具創建了一種自定義語言。我不知道如何將它加載到我的 VueJS 應用程式中。我嘗試了以下并沒有收到任何錯誤，但它似乎也沒有顯示作業，因為在 Monarch 工具中，我在已知功能等上得到藍色文本，但在我的編輯器中我沒有。其他語言按預期作業。
const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
const path = require('path');
const main = path.resolve(__dirname, './src/test/test.ts');
module.exports = {
configureWebpack: {
plugins: [
new MonacoWebpackPlugin({
languages: ['javascript', 'typescript', 'python', 'java', 'python', 'json', 'vb'],
customLanguages: [
{
label: 'test',
entry: main
}
]
})
]
}
...
我讓我的.ts檔案基本上匯出了一個conf包含所有變數或tokenizer. 我還匯出了一個language屬性。我不完全確定這是正確的格式。
我的.ts檔案基本上看起來像：
export const conf = {...}
export const language = {...}
我不完全確定在這里做什么。自定義語言的檔案很少，除了我認為我至少有定義語言作業的第一部分之外似乎沒有任何作業。
uj5u.com熱心網友回復：
實際上并不需要那個 Webpack 插件。
基于自定義語言示例，您可以在運行時通過monaco.languages.setMonarchTokensProvider(). 第二個函式引數是 的實體IMonarchLanguage，它與您鏈接的示例中的語言規范相匹配。
<script setup lang="ts">
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api'
import { ref, onMounted } from 'vue'
/**
* `customLangMonarch` contains the language spec example from
* https://microsoft.github.io/monaco-editor/monarch.html
*/
// @ts-ignore
import customLangMonarch from '@/custom-lang-monarch'
monaco.languages.register({ id: 'custom' })
monaco.languages.setMonarchTokensProvider('custom', customLangMonarch)
const editor = ref()
onMounted(() => {
monaco.editor.create(editor.value, {
language: 'custom',
})
})
</script>
帶有 Vue CLI 的演示
帶 Vite 的演示
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/447180.html