How do I turn an entire vue app into a Module - vue.js

I have built a simple Vue app. Currently it only has one screen.
I am trying to convert this app into a "module". ie: I want to be able to give somebody a script tag. They put that script tag into a generic HTML page. And when that script tag loads, it should render my VUE app.
I could give them an iframe, but I'm trying to do it via a Script Tag so that they could skin the app using their own CSS.
Can anybody guide me into where to start with this? I am using CLI VUE; so there are some files getting built. Is there a better approach than simply giving URLs to all the JSS and CSS files that are currently being generated by webpack?

Related

Vue js dev Environment - require rebuild application to see html and css changes

-Hello I am new in Vue, I am building VueJS application in SPA with SFC, I was wondering if there is any way to see html changes without rebuild the application again, changes in all file reflect immediately but changes in html and css required execute npm run dev again.
I use Vue3, js and bootstrap only, I am not using nodejs or typescript.
I need some way to make my changes reflect on html after saving file with out rebuilding the application.

Adding VUE js to an existing Electron App

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.

NetSuite Suitelet/RESTlet to display VueJS app

I am attempting to build a popup Suitlete that displays a Vue app. It needs to have the ability to pass data back and forth into the transaction that opened it.
Has anyone done this in the past and if so what did the setup for the Vue files and the Suitelet/RESTlet look like? Can't seem to find examples.
You can find projects on GitHub that have great Vue/NetSuite project file setups, ones where you can use Vue CLI to work locally that still work with RESTlets. Here's one https://github.com/michoelchaikin/netsuite-mapreduce-util

How to produce SSG from a vue project without nuxt

I created a vue project using the vue cli:
vue create myproject
I figured that the output when I do npm run build will be a single page application (SPA). What do I need to produce a static website (SSG / Jamstack) with my existing code? I know I could easily do it with Nuxt, but I would like to know how to do it without Nuxt.
EDIT: I think what I meant was to have some of the pages pre-rendered so that it's better for SEO.
To be clear, the result of your build is a SPA that is static HTML and JS. The user may see dynamic content based on the JS, but it's essentially static and could be deployed to Jamstack hosts like Netlify or Vercel. In other words, unless I'm misreading what you want, there isn't anything special you need to do.

How to create a component to share across websites?

I want to create a Vue component that has fairly large amount of html/css/js.
The goal is someone should be able to add this component to their website, and without having to write their own duplicate html/css they should see roughly the same on their website as it looks on mine.
I've made a component that I can use on my own website, but how can I make it available to use on other websites? Can people just include a .js file perhaps? But how would they import the html/css into a page?
You can prepare your component so that it can be packaged and published on NPM
maybe this post can help you to achieve that How To Publish Your Vue.js Component On NPM