monaco-editor 汉化,需求拿到百度一番:
npm install monaco-editor-esm-webpack-plugin --save-dev
npm install monaco-editor monaco-editor-webpack-plugin monaco-editor-nls
webpack配置:
const MonacoWebpackPlugin = require('monaco-editor-esm-webpack-plugin'); //使用require,esm版本
module.exports = {
module: {
rules: [
{
test: /\.js/,
enforce: 'pre',
include: /node_modules[\\\/]monaco-editor[\\\/]esm/,
use: MonacoWebpackPlugin.loader
}
]
},
plugins: [
new MonacoWebpackPlugin()
]
};
//设置语言包
import { setLocaleData } from "monaco-editor-nls";
import zh_CN from "monaco-editor-nls/locale/zh-hans";
setLocaleData(zh_CN)
//使用
//注意不要使用esm方式引入,webpack会提前打包,导致语言包设置失败,使用动态import
const monaco = require("monaco-editor/esm/vs/editor/editor.api");
const editor = monaco.editor.create(document.getElementById('monaco_editor'), {
value: 'export const msg = "hello world"',
});
装完发现版本太高.还有loader 报错等问题,
继续搜:
monaco-editor的使用,以及在webpack汉化_izhuoo的博客-CSDN博客_monaco-editor
使用下面版本汉化:
{
"dependencies": {
...
"monaco-editor": "0.30.1",
"monaco-editor-nls": "^2.0.0",
},
"devDependencies": {
...
"monaco-editor-esm-webpack-plugin": "^2.0.0",
"monaco-editor-webpack-plugin": "6.0.0"
},
}
使用以上版本再加上之前的配置,完成汉化