{"action":"created","issue":{"url":"https://api.github.com/repos/express-vue/express-vue/issues/76","repository_url":"https://api.github.com/repos/express-vue/express-vue","labels_url":"https://api.github.com/repos/express-vue/express-vue/issues/76/labels{/name}","comments_url":"https://api.github.com/repos/express-vue/express-vue/issues/76/comments","events_url":"https://api.github.com/repos/express-vue/express-vue/issues/76/events","html_url":"https://github.com/express-vue/express-vue/issues/76","id":228958969,"number":76,"title":"Import of third party components documentation","user":{"login":"GuillaumeNury","id":12662533,"avatar_url":"https://avatars0.githubusercontent.com/u/12662533?v=3","gravatar_id":"","url":"https://api.github.com/users/GuillaumeNury","html_url":"https://github.com/GuillaumeNury","followers_url":"https://api.github.com/users/GuillaumeNury/followers","following_url":"https://api.github.com/users/GuillaumeNury/following{/other_user}","gists_url":"https://api.github.com/users/GuillaumeNury/gists{/gist_id}","starred_url":"https://api.github.com/users/GuillaumeNury/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/GuillaumeNury/subscriptions","organizations_url":"https://api.github.com/users/GuillaumeNury/orgs","repos_url":"https://api.github.com/users/GuillaumeNury/repos","events_url":"https://api.github.com/users/GuillaumeNury/events{/privacy}","received_events_url":"https://api.github.com/users/GuillaumeNury/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2017-05-16T08:51:54Z","updated_at":"2017-05-17T08:49:02Z","closed_at":null,"body":"I can use my own components after setting `componentsDir`, but I failed using third-party components.\r\nI tried to use both [vue-multiselect](http://monterail.github.io/vue-multiselect) and [vue2-google-maps](https://www.npmjs.com/package/vue2-google-maps).\r\n\r\nI tried to register vue-multiselect locally : \r\n```html\r\n<template>\r\n\t<div>\r\n\t\t<multiselect v-model=\"selected\" :options=\"options\">\r\n\t\t</multiselect>\r\n\t</div>\r\n</template>\r\n\r\n<script>\r\nimport Multiselect from 'vue-multiselect'\r\nexport default {\r\n\tcomponents: { Multiselect },\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\tselected: null,\r\n\t\t\toptions: ['list', 'of', 'options']\r\n\t\t}\r\n\t}\r\n}\r\n</script>\r\n```\r\nThis lead to a `Uncaught SyntaxError: Unexpected identifier` because of a `[native code]` in generated script.\r\n\r\nThen, I tried to register `vue-multiselect` globally in the layout, it works !\r\n```html\r\n<!-- Layout.vue -->\r\n<template>\r\n\t<!DOCTYPE html>\r\n\t<html lang=\"en\">\r\n\t\t<head>\r\n\t\t\t<meta charset=\"UTF-8\">\r\n\t\t\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no\">\r\n\t\t\t<link href=\"/static/style.css\" rel=\"stylesheet\" type=\"text/css\"></link>\r\n\t\t\t<script src=\"/static/scripts/vue.js\"></script>\r\n\t\t\t<script src=\"/static/scripts/vue-resource.js\"></script>\r\n\t\t\t<script src=\"/static/scripts/lodash.js\"></script>\r\n\t\t\t<script src=\"https://unpkg.com/vue-multiselect@2.0.0-beta.14\"></script>\r\n\t\t\t<link href=\"https://unpkg.com/vue-multiselect@2.0.0-beta.14/dist/vue-multiselect.min.css\" rel=\"stylesheet\" type=\"text/css\"></link>\r\n\t\t\t<script>\r\n\t\t\t\tVue.component('multiselect', VueMultiselect.Multiselect)\r\n\t\t\t</script>\r\n\t\t</head>\r\n\t\t<body class=\"container\">\r\n\t\t\t{{{app}}}\r\n\t\t\t{{{script}}}\r\n\t\t</body>\r\n\t</html>\r\n</template>\r\n\r\n<script>\r\n</script>\r\n\r\n<style>\r\n</style>\r\n\r\n<!-- AView.vue -->\r\n<template>\r\n\t<div>\r\n\t\t<multiselect v-model=\"selected\" :options=\"options\">\r\n\t\t</multiselect>\r\n\t</div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\tselected: null,\r\n\t\t\toptions: ['list', 'of', 'options']\r\n\t\t}\r\n\t}\r\n}\r\n</script>\r\n```\r\n\r\nBut this way of registering does not work for `vue2-google-maps` because it appends elements on `document.body` and `body` is not yet initialized.\r\n\r\nIs there any way of registering third party components not globally in the header  of the layout ?"},"comment":{"url":"https://api.github.com/repos/express-vue/express-vue/issues/comments/302026986","html_url":"https://github.com/express-vue/express-vue/issues/76#issuecomment-302026986","issue_url":"https://api.github.com/repos/express-vue/express-vue/issues/76","id":302026986,"user":{"login":"danmademe","id":399473,"avatar_url":"https://avatars0.githubusercontent.com/u/399473?v=3","gravatar_id":"","url":"https://api.github.com/users/danmademe","html_url":"https://github.com/danmademe","followers_url":"https://api.github.com/users/danmademe/followers","following_url":"https://api.github.com/users/danmademe/following{/other_user}","gists_url":"https://api.github.com/users/danmademe/gists{/gist_id}","starred_url":"https://api.github.com/users/danmademe/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/danmademe/subscriptions","organizations_url":"https://api.github.com/users/danmademe/orgs","repos_url":"https://api.github.com/users/danmademe/repos","events_url":"https://api.github.com/users/danmademe/events{/privacy}","received_events_url":"https://api.github.com/users/danmademe/received_events","type":"User","site_admin":false},"created_at":"2017-05-17T08:49:02Z","updated_at":"2017-05-17T08:49:02Z","body":"I don't support third party plugins yet. You can't use import statements in vue files. I'm working on that. "}}
{"actor":{"display_login":"danmademe"}}