【发布时间】:2020-02-18 17:35:08
【问题描述】:
我正在使用基本的 Vue 路由
const routes = [
{ path: "/home", component: Home }
];
const router = new VueRouter({
routes // short for `routes: routes`
});
const app = new Vue({
router
}).$mount("#app");
取自这个绿色示例: Can we make vue.js application without .vue extension component and webpack?
一切都完美无缺。我没有使用 webpack。
现在,我在 index.html 中添加 APEXCHARTS 库
<script src="https://cdn.jsdelivr.net/npm/apexcharts" type="module"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-apexcharts" type="module"></script>
这是我的组件之一,使用文字
const Home = {
data: function() {
return {
options: {
chart: {
id: 'vuechart-example'
},
xaxis: {
categories: [1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998]
}
},
series: [{
name: 'series-1',
data: [30, 40, 45, 50, 49, 60, 70, 91]
}]
}
},
template:
'<div><apexchart width="500" type="bar" :options="options" :series="series"></apexchart></div>'
};
这是错误
[Vue warn]: Unknown custom element: <apexchart> - did you register the component correctly? For recursive components, make sure to provide the "name" option
我的问题是:如何在不使用 WEBPACK 和使用 vue 2 路由器的情况下导入此模块或任何其他模块?我不能使用'IMPORT',它不起作用,有没有办法在vue实例化new Vue中提及模块名称?
过去,ANGULARJS 需要模块名称,但是我不知道在哪里添加模块名称,我不能使用 IMPORT 语法,请帮助。
谢谢
编辑: 我做了一个 FIDDLE: https://jsfiddle.net/nicolas1000/rke9xadq/
【问题讨论】:
-
大多数软件包还不支持 ESM 模块。大多数服务器也没有针对 HTTP/2 进行优化。既然 Vue CLI 设置了你需要的一切,为什么你不想使用捆绑器?
-
因为我的整个应用都已经这样构建了,所以将其转换为.vue文件会花费很多时间
标签: javascript vue.js webpack apexcharts