javascript - 从 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>在你的模板中。