無法從導入中引入 Vue，但如果我將其引入 html 文件中，則可以訪問它

Question

所以我從 React 切換到 Vue，並且只有一個簡單的 hello world 項目，只有當我在 HTML 文件的script標簽中引入 Vue 時才有效。 但是我不能像這樣導入節點模塊：

import './node_modules/vue/dist/vue.js

或者

import Vue from 'vue'

就像我說的，如果我的 HTML 文件中有一個腳本，例如

<script src='./node_modules/vue/dist/vue.js'></script>
<script src="app.js"></script>

然后我可以在我的app.js ：

 new Vue({
    el: '#app',
    data: {
        message: 'Hello vue'
    }
});

讓它工作得很好。

為什么我只能從腳本標簽中引入 Vue？

可能重要或不重要的注意事項：我使用 NPM 並通過 NPM 安裝了 Vue，它列在我的依賴項中。 我沒有使用 webpack 或任何類型的轉譯器，如 babel。

Answer 1

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

您必須將腳本聲明為“module”類型，以告訴瀏覽器它是一個 ES6 模塊文件，然后假設您的瀏覽器支持它，您就可以使用import關鍵字。 瀏覽器支持： https : //caniuse.com/#feat=es6-module