Question

美好的一天，

我最近为导航栏创建了一个npm包，我想将其导入到我的主代码库中。我正在使用vue @components，我无法找到如何使用导入的组件。如果有人知道如何将npm打包组件放入dom，我们将非常感谢您的帮助。

以下是我尝试过的简化示例：

npm package 

    import Vue from 'vue';
    import Component from 'vue-class-component';
    import '../navigation-bar.styles.less';
    @Component({template: require('../navigation-bar.html')}})
    export class NavigationBar extends Vue {
       constructor() {
        super();
                  }
    }
    Vue.component('navigation-bar', NavigationBar);

main.ts

    import { NavigationBar } from '@international-client/navigation-bar';
    Vue.component('navigation-bar', NavigationBar);

index.html
    <html>
        <head>
            <title>Game</title>
        </head>
        <navigation-bar></navigation-bar>
        <body class="game-view">
        </body>
    </html>

Answer 1

代表我的错误：

上面的代码确实可以正常注册组件。

export function setupVM(): Vue {
    const vm = new Vue({
        el: '#navigation-bar',
        components: {
            navigationBar: NavigationBar
        }
    });
    return vm;
}

无法从npm包导入vue组件

1 个答案: