Skip to content
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

@MoYummy

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.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions