为什么js文件中import其他js编译器不报错，浏览器报错？

Question

初学vue，不想用vue-cli和webpack，但是引入vue.js会报错，package中也有依赖，编译器没报错，但是浏览器报Uncaught SyntaxError: Unexpected identifier

可以看到，webstorm没有报错信息

js代码：

import Vue from 'vue'
import Resource from 'vue-resource'
import {AsyncComponent as reject } from 'vue'
import {AsyncComponent as resolve} from 'vue'
Vue.use(Resource);
var vm = new Vue({
    el: '#app',
    data: {
        adminName:'',
        password:'',
        message:'未提交',
        url:'localhost:8080/ssm/admin/find',
        id:1
    },
    methods: {
        submit: function () {
            this.message='已提交！！！';
            var params=new Object();
            params.name=this.adminName;
            Vue.http.get(
                this.url,
                {
                    params: params
                },
                {emulateJSON: true}
            )
                .then((success) => {
                    resolve(success);
                })
                .catch((error) => {
                   reject(error);
                });
        }
    }
});

Answer 1

楼主，如果不想用 webpack 的化，那就需要引入 UMD 模式的js文件。

import Vue from 'vue';
// 上面的方式引入的是 vue.runtime.common.js
// 浏览器不支持这种 CMD 模式的引入的
// 必须是 UMD，也就是引入 vue.js 或 vue.min.js
// 如可以直接在 html 文件里引入地址： https://unpkg.com/vue@2.5.17/dist/vue.js

Answer 2

index.html文件中的script标签加一个属性就解决了
type="module"

<script type="module" src=""></script>

阮老师的文章中有写到
链接描述

Answer 3

你所谓的编译器是什么？代码编辑器？IDE？那是代码识别。浏览器暂时还没实现import关键字，所以还是老老实实的用webpack吧。不想用webpack就直接用babel-cli去转成es5