Hi I want to initiate Vue application from separate project and import Vue components to it by another project. When working on I got an issue between multiple Vue instances . To solve that I'm trying to create separate bundle for Vue and try to initiate application on separate project by it which uses to create components. How to create separate bundle for Vue which can be used from different projects?
Hi for reference any one. Inside webpackconfig under externals can define as Vue : ['Vue'].
Related
Recently I migrated my web application to Vue 3 which is implemented with Vue 2 earlier. This app is using as a web component for other websites with different frameworks. In vue 2 once the application is build as web component it is nicely generating the the compressed version of js files and can add to other website direcly. In vue 2 I used below command to build the web component.
vue-cli-service build --target wc --name widget-v2 ./src/components/EntryComponent.vue
It is generating the js files and we can simply import that files to other website and add the web component tag like : <widget-v2></widget-v2> to html and it works.
But once I migrated the app to Vue 3 when I try to build the app as web component it is showing the below error.
I search through internet and found out we have to change the build command like below.
vue-cli-service build --target lib --name widget-v3 src/components/EntryComponent.vue
But the issue is once the js files are generated and when I import the js to other web page and add the tag same as easier it does not work.
I checked the demo.html how the widget added in there. But it is different from earlier than Vue2 version which is added like this. But we can pass props in this method which I tried and generated errors.
My question is how can we add the web component as simply as in Vue 2 when we use Vue 3.
I have an existing Electron APP with hand coded HTML all over the place and a lot of copy pasted code.
I would like to slowly integrate VUE to reduce the copy pasted components.
All the articles I find assume I use "vue add electron-builder" and start a project from scratch.
How can I add VUE to an existing complete Electron Append migrate 1 component at a time?
here I've found a link. You can add Vue to your project however you like it.
You can use vue create news-app command and add electron builder top of it.
How i can add some custom env variables in my electron app? I want use them to store api keys and other things that I don't want to write directly into the code. I'm using vue and electron.
If I understand well I need to create a new .env file in the root of the vue electron project?
[https://www.electronjs.org/docs/api/environment-variables]
that's the documentation link for environment vars
I have an Existing Vue js app which was not built using Vue CLI, Now I want to convert this app to a Vue CLI project how can I achieve it and what changes I have to make to my existing app in order to make it successful
The new Vue.js 3.0 plugin architecture is nice, but it seems to to be missing a router plugin. If I choose not to install routing when I first create the project (vue create my-project), I'd expect that I could change my mind later and add routing with something like vue add #vue/router, but that plugin doesn't appear to exist. Is there a way to add routing from the CLI after the fact?
After some experimenting with vue-cli3, i found that you can use vue add to setup components you missed.
Use vue add router That set up the routing and created some sample components Home and About.
This also work for other modules like adding vuetify with vue add vuetify. You can read more about vue add from the plugins and presets guide
Have a look at the issue page here: https://github.com/vuejs/vue-cli/issues/1202, the conclusion is you can't use cli to add router if you didn't choose router initially.
With three reasons:
Late-adding router when you've already modified the entry file is extremely fragile.
If you haven't modified the file much, you can just re-generate the project instead.
If we only add the dependency and skip the file-modifying part, then it's easier to just npm install vue-router or yarn add vue-router.