This repository was archived by the owner on Feb 4, 2024. It is now read-only.
This repository was archived by the owner on Feb 4, 2024. It is now read-only.
How to load this in systemjs #2
Description
This is an awesome library, but I faild to use it for my site https://github.com/moyummy/vue-static
As a simple example, I modify vue-static/src/app/index.js like this:
import Vue from 'vue'
import router from './router'
import store from './store'
import VueUi from '@vue/ui'
import '../lib/github.com/vuejs/ui/0.2.5/vue-ui.css!css'
Vue.use(VueUi)
new Vue({
el: '#app',
router,
store,
template: '<VueLoadingBar unknown/>'
})
However, it gives me error:
vue.js:597 [Vue warn]: Unknown custom element: <VueLoadingBar> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
(found in <Root>)
warn @ vue.js:597
I checked _installedPlugins in console
Vue._installedPlugins
(3) [{…}, ƒ, {…}]
0:{Store: ƒ, install: ƒ, version: "3.0.1", mapState: ƒ, mapMutations: ƒ, …}
1:ƒ (t)
2:{VueUi: {…}, regeneratorRuntime: {…}}
This is different from when I imported it and made it work through html script tag
Vue._installedPlugins
(5) [{…}, {…}, {…}, {…}, {…}]
0:{version: "0.4.3", install: ƒ}
1:{install: ƒ, options: {…}}
2:{version: "0.4.4", install: ƒ}
3:{install: ƒ}
4:{version: "0.2.5", install: ƒ}
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://unpkg.com/@vue/ui@0.2.5/dist/vue-ui.css"/>
</head>
<body>
<div id="app"></div>
<script src="http://unpkg.com/vue@2.5.16/dist/vue.js"></script>
<script src="http://unpkg.com/@vue/ui@0.2.5/dist/vue-ui.min.js"></script>
<script>new Vue({el:'#app',template:'<VueLoadingBar unknown/>'})</script>
</body>
</html>
Could anybody provide some suggestions? Thanks.