无法在 Laravel blade 脚本标签中导入 JS 模块

Question

我有一个 Laravel 项目。在 resource/js/app.js 我有一个 Vue 实例，当我想在我的 blade 中读取或写入 vm 时，我做不到！我认为这是因为我的 webpack.mix.js 但我无法弄清楚确切原因是什么。

resources/js/app.js:

let vm = new Vue({
 data() {
  return {
   order: {
    isOrgan: false
   }
  };
 },
 router,
 store
}).$mount('#app')

export default vm;

resources/views/app.blade.php:

<script src="/js/app.js"></script>

<script type="module">
 import vm from '/js/app.js';
 console.log(vm);
</script>

Answer 1

import 是 CommonJS，在浏览器中不可用，这就是它不起作用的原因。如果你绝对想在 app.js 之外做 console.log(vm)，你需要这样做

window.vm = new Vue({
 data() {
  return {
   order: {
    isOrgan: false
   }
  };
 },
 router,
 store
}).$mount('#app')

那么你的console.log(vm)（隐式console.log(window.wm)）就可以了。

Can't import JS module in Laravel blade script tag