Question

当前为旧版项目添加了一些功能。前端只是所有网页的jquery。有人告诉我要添加另一个网页，并且由于需要复杂的功能，我真的想使用Vuetify + Vue ...没有Webpack或我们今天拥有的任何不错的功能，这对我来说有点挫折，但是我只会使用CDN。

我遇到的问题是需要支持IE（用户请求）。目前，这些脚本标记使所有功能都可以在Chrome浏览器中运行：

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.24.0/babel.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-resource@1.5.1"></script>
<link href='https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons' rel="stylesheet">
<script  src="https://cdn.jsdelivr.net/npm/vuetify/dist/vuetify.js"></script>
<link href="https://cdn.jsdelivr.net/npm/vuetify/dist/vuetify.min.css" rel="stylesheet">
<jsp:include page="components/location_component.jsp"></jsp:include>

我如何仅使用CDN就可以在IE中使用它？我在遇到有关ES6语法的错误时，这就是我引入babel的原因。仍然出现与以前相同的错误。

    <div id="app">
        <v-app> 
            <v-container> 
                <location @workstationchange="handleWorkstationChange($event)"></location> 

            </v-container> 
        </v-app>
    </div>
</div>

<script>
    var app = new Vue({
        el : '#app',
        data : {
            workstationSelected : null,
        },
        methods : {
            handleWorkstationChange : function(id) {
                this.workstationSelected = id
            }
        },
        mounted: function(){

        }
    })
</script>

位置是我创建的一个相当长的组件，但是它只是从数据库中填充了一些下拉菜单...没什么复杂的。它使用ES6箭头功能，排序，Set（），散布运算符等...试图使这篇文章简短一些。

任何人都知道如何仅通过使用CDN使ES6在与IE兼容的旧版环境中工作吗？我在做什么错了？

Answer 1

您可以将Vuetify与IE11一起使用。

要在不能利用构建工具（例如Webpack）的遗留项目中使用它，可以在遗留项目之外构建项目，然后使用构建工具（例如Webpack）构建项目。然后，您可以将Javascript文件Webpack输出（通常是/dist/build.js）导入到您的旧项目中，例如：

<script src="build.js" />

您还需要将Vue项目中使用的所有资产转移到旧项目中。

尽管它是非常规的，但它确实可以工作，并且可以利用项目中现有的Javascript和Web服务，就好像它是从那里开始的。

是否可以在需要支持IE的旧项目中使用Vue + Vuetify？

1 个答案: