无法在Vue Framework上的main.js中使用导入模块

Question

无法在Vue App中安装软件包

我想使用package vue-tel-input https://www.npmjs.com/package/vue-tel-input作为我的登录表单Vue但是当我导入并安装全局组件时，我收到了这个错误：

'Uncaught SyntaxError: Unexpected identifier". 

这是导入代码

import Vue from 'vue';
import VueTelInput from 'vue-tel-input';

Vue.use(VueTelInput);

Vue.component('js-login', {
    template: `
    <div>
        <div class="js-login-wrap">
            <form class="js-login">
            <h2 class="js-login-heading">Login to Loket</h2>
            <label for="name">Name</label>
            <input type="text" id="field_name" class="form-control" placeholder="Name" required autofocus>
            <label for="email">Email</label>
            <input type="email" id="field_email" class="form-control" placeholder="Email" required autofocus>
        </form>
    </div>
</div>`,
})

new Vue({
    el: '#app',
})

我的目录：enter image description here

我该怎么办？

Answer 1

如他们的文档中所述：

'浏览器的ESM（仅限2.6+）：用于通过现代浏览器直接导入。 reference

所以尝试将type="module"添加到你的main.js：

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