从 vue-cli 应用程序中的 node_modules 导入 js 文件

Posted 2023-02-23

【中文标题】从 vue-cli 应用程序中的 node_modules 导入 js 文件

【英文标题】：Import js file from node_modules in vue-cli app

【发布时间】：2018-05-07 05:26:26

【问题描述】：

我已经用 npm 安装了这个：https://github.com/hchstera/vue-charts

在做npm install hchs-vue-charts

在我看来，这是一个制作图表的包。

我只想知道如何使用 Vue-cli 应用程序 (https://github.com/vuejs/vue-cli) 将这个库从 node_modules 导入到 Vuejs 的单个组件中，因为在他们的示例中，他们使用 Vue 实例来实现。

谢谢

【参考方案1】：

您必须在 ma​​in.js

中安装模块

import Vue from 'vue'
import VueCharts from 'hchs-vue-charts'

Vue.use(VueCharts)

然后在你的应用中到处使用组件，像这样：

<template>
  <div id="app">
    <chartjs-line></chartjs-line>
  </div>
</template>

lib 中的其他组件：

<chartjs-bar/>
<chartjs-horizontal-bar/>
<chartjs-radar/>
<chartjs-polar-area/>
<chartjs-pie/>
<chartjs-doughnut/>

【讨论】：

可能还有其他配置。 Vue 没有找到所有这样的库。

这些组件由 VueCharts 提供并在全球范围内注册。见github.com/hchstera/vue-charts/blob/…

【参考方案2】：

在main.js 中导入 vue-charts 并像这样初始化插件：

import VueCharts from 'hchs-vue-charts'

Vue.use(VueCharts)