从 node_modules 导入 JS 到 Vue

Question

请原谅我缺乏专业知识，但我正在尝试将这个Grid System 集成并导入到我自己的 Vue 设置中，我遇到了一些小麻烦。现在，我通常会像这样导入插件：

import VuePlugin from 'vue-plugin'

Vue.use(VuePlugin)

然后我就可以在全球范围内使用所述插件的组件，但这不是一个插件，我无法将所需的组件拉入/导入到我自己的组件中...建议？

Answer 1

如果你通过 NPM 使用它：

首先，安装：

npm install --save vue-grid-layout

然后“注册”它（可能是.vue - 或.js - 文件）：

import VueGridLayout from 'vue-grid-layout'

export default {
  ...
  components: {
    'GridLayout': VueGridLayout.GridLayout,
    'GridItem': VueGridLayout.GridItem
  }

如果你通过<script>标签使用它：

当然，在某处添加它：

<script src="some-cdn-or-folder/vue-grid-layout.min.js"></script>

然后“注册”它（可能是.js 文件或另一个<script> 标签）：

var GridLayout = VueGridLayout.GridLayout;
var GridItem = VueGridLayout.GridItem;

new Vue({
    el: '#app',
    components: {
        "GridLayout": GridLayout,
        "GridItem": GridItem
    },

---

并且...在您的模板中

在这两种情况下，您都可以在模板中使用<grid-layout ...></grid-layout>。