标题重写为：모듈이 WebAssembly 모듈인 것처럼 보이지만 webpack에 대해서는 플래그가 지정되어 있지 않습니다.

Question

Vue 프로젝트에서 WebAssembly 모듈(Rust로 작성되고 wasm-pack을 사용하여 컴파일됨)을 가져오려고 합니다. 제가 한 일은 프로젝트를 만드는 것이었습니다:

vue-cli create my-vue-webasm-proj

저는 Vue 2를 선택했습니다.之后我了async beforeCreate())：

/* main.js */

'vue'에서 Vue 가져오기
'./App.vue'에서 앱 가져오기

Vue.config.productionTip = 거짓

새로운 Vue({
  렌더링: h => h(앱),
  비동기 beforeCreate() {
    const wlib= import import('my-webasm-lib')를 기다립니다.
    console.log(wlib)
  },
}).$mount('#app')

여기 npm runserve 之后我收到此错误：

모듈 구문 분석 실패: 예상치 못한 문자 ''(1:0)
모듈이 WebAssembly 모듈인 것 같지만 모듈이 webpack용 WebAssembly 모듈로 플래그가 지정되지 않았습니다.
주요 변경 사항: webpack 5부터 WebAssembly는 기본적으로 활성화되지 않으며 실험적 기능으로 표시됩니다.
'experiments.asyncWebAssembly: true'(비동기 모듈 기반) 또는 'experiments.syncWebAssembly: true'(예: webpack 4, 더 이상 사용되지 않음)를 통해 WebAssembly 실험 중 하나를 활성화해야 합니다.
WebAssembly로 트랜스파일되는 파일의 경우 구성의 'module.rules' 섹션에서 모듈 유형을 설정해야 합니다(예: 'type: "webassemble/async"').
(이 바이너리 파일에서는 소스 코드가 생략되었습니다.)

如何修复它?

我尝试将此配置添加到 webpack.config.js 中，正如所说的那样，但没有成功：

module.exports = {
  실험: {
    asyncWebAssembly: 사실,
    importAsync: 사실
  }
}

나의 package.json 如果如下：

...
"종속성": {
  "core-js": "^3.8.3",
  "my-webasm-lib": "파일:../my-webasm-lib/my-webasm-lib-pkg",
  "뷰": "^2.6.14"
},
"devDependency": {
  "@babel/core": "^7.12.16",
  "@babel/eslint-parser": "^7.12.16",
  "@vue/cli-plugin-babel": "~5.0.0",
  "@vue/cli-plugin-eslint": "~5.0.0",
  "@vue/cli-service": "~5.0.0",
  "에슬린트": "^7.32.0",
  "eslint-plugin-vue": "^8.0.3",
  "vue-템플릿-컴파일러": "^2.6.14"
},
...

Answer 1

답변이 조금 늦었지만 누군가에게 도움이 될 수도 있습니다.

으아악