javascript - 无法从导入中引入 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>

您必须将脚本声明为“模块”类型，以告诉浏览器它是一个 ES6 模块文件，然后您可以使用 import 关键字(假设您的浏览器支持它)。浏览器支持:https://caniuse.com/#feat=es6-module