无法从 npm 包中导入 vue 组件
Posted
技术标签:
【中文标题】无法从 npm 包中导入 vue 组件【英文标题】:can't import vue component from npm package 【发布时间】:2018-02-23 11:41:52 【问题描述】:早安,
我最近为一个导航栏创建了一个 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>
【问题讨论】:
错误是什么?你在哪里初始化vue?它附着在什么元素上? 没有错误,导航栏组件显示为代表我犯了一个非常严重的错误:
如果您正确注册了组件,上述代码确实可以工作。
export function setupVM(): Vue
const vm = new Vue(
el: '#navigation-bar',
components:
navigationBar: NavigationBar
);
return vm;
【讨论】:
以上是关于无法从 npm 包中导入 vue 组件的主要内容,如果未能解决你的问题,请参考以下文章
如何在 vue 3 (Danfo.js) 中导入 NPM 包