如何在没有 webpack 的情况下使用 Vue.Draggable CDN?

Est*_*ood 5 vue-component vuejs2 vuedraggable

我是 Vue 的新手。我客户的 CodeIgniter 网站上的其中一个页面 (salesview) 需要使用 Vue,因此我将其包含在

<script src="https://cdn.jsdelivr.net/npm/vue"></script>

我在一个名为salesview.js. 现在,我需要使用Vue.Draggable组件。我将它添加到页面中,如下所示:

<script src="//cdn.jsdelivr.net/npm/sortablejs@1.8.4/Sortable.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/Vue.Draggable/2.20.0/vuedraggable.umd.min.js"></script>
Run Code Online (Sandbox Code Playgroud)

由于我没有使用 webpack,我该如何使用这个组件?

Est*_*ood 9

我通过从 window 对象访问 vuedraggable 并将其添加到组件选项中解决了我的问题,如下所示:

var vm = new Vue({
    el: '#app',
  components: {
    'sv-lead-column': svLeadColumn,
    'sv-customer-column': svCustomerColumn,
    draggable: window['vuedraggable']
  },
  ...
})
Run Code Online (Sandbox Code Playgroud)

  • 谢谢你!社区将我们这些新手排除在他们的“使用步骤”之外,而这些步骤认为许多事情是理所当然的。我想尝试做一个非常简单的应用程序/网络,没有数千个依赖文件和一堆构建器(vue cli、webpack、npm、yarn、minifiers...)和节点服务器。:(( (3认同)