使用mode的js文件就会报错MIME type ('text/html') is not executable,

[chenxiaoxing]

Describe the bug

Refused to execute script from 'http://localhost:8080/js/mode-javascript.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.
ace.js:804

   GET http://localhost:8080/js/theme-dark.js net::ERR_ABORTED 404 (Not Found)

exports.loadScript @ ace.js:804
load @ ace.js:1218
exports.loadModule @ ace.js:1236
VirtualRenderer.setTheme @ ace.js:19071
Editor.setTheme @ ace.js:13934
eval @ index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/Ace.vue?vue&type=script&setup=true&lang=ts:40
eval @ runtime-core.esm-bundler.js:3015
callWithErrorHandling @ runtime-core.esm-bundler.js:336
callWithAsyncErrorHandling @ runtime-core.esm-bundler.js:344
hook.__weh.hook.__weh @ runtime-core.esm-bundler.js:2995
flushPostFlushCbs @ runtime-core.esm-bundler.js:510
flushJobs @ runtime-core.esm-bundler.js:548
Promise.then (async)
queueFlush @ runtime-core.esm-bundler.js:451
queuePostFlushCb @ runtime-core.esm-bundler.js:471
queueEffectWithSuspense @ runtime-core.esm-bundler.js:1890
scheduler @ runtime-core.esm-bundler.js:2101
resetScheduling @ reactivity.esm-bundler.js:307
triggerEffects @ reactivity.esm-bundler.js:346
triggerRefValue @ reactivity.esm-bundler.js:1111
set value @ reactivity.esm-bundler.js:1156
finalizeNavigation @ vue-router.mjs:3374
eval @ vue-router.mjs:3239
Promise.then (async)
pushWithRedirect @ vue-router.mjs:3206
push @ vue-router.mjs:3131
eval @ index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts&setup=true:24
eval @ index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts&setup=true:19
eval @ runtime-core.esm-bundler.js:3015
callWithErrorHandling @ runtime-core.esm-bundler.js:336
callWithAsyncErrorHandling @ runtime-core.esm-bundler.js:344
hook.__weh.hook.__weh @ runtime-core.esm-bundler.js:2995
flushPostFlushCbs @ runtime-core.esm-bundler.js:510
render @ runtime-core.esm-bundler.js:6770
mount @ runtime-core.esm-bundler.js:4067
app.mount @ runtime-dom.esm-bundler.js:1658
eval @ main.ts:19
./src/main.ts @ app.js:63
webpack_require @ app.js:198
(anonymous) @ app.js:1392
webpack_require.O @ app.js:250
(anonymous) @ app.js:1393
(anonymous) @ app.js:1395
Show 29 more frames
Show less
:8080/#/home:1 Refused to execute script from 'http://localhost:8080/js/theme-dark.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

Expected Behavior

服务器自动处理配置提供正确的MIME类型

Current Behavior

目前使用版本"ace-builds": "^1.32.7"+vue3+ts，代码错误行editorInput.value.session.setMode("ace/mode/javascript");，错误提示：Refused to execute script from 'http://localhost:8080/js/mode-javascript.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

Reproduction Steps

目前使用版本"ace-builds": "^1.32.7"+vue3+ts，代码错误行editorInput.value.session.setMode("ace/mode/javascript");，错误提示：Refused to execute script from 'http://localhost:8080/js/mode-javascript.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

Possible Solution

服务器自动处理配置提供正确的MIME类型

Additional Information/Context

No response

Ace Version / Browser / OS / Keyboard layout

"ace-builds": "^1.32.7"+vue3+ts

[Nanne]

What bundler are you using?

For ESM you could use:

import ace from 'ace-builds';
import 'ace-builds/esm-resolver';

Like the ace-builds-vitejs example.