How to load a vuejs build into another vuejs?
To load a Vue.js build into another Vue.js application, you need to properly configure the new application to include the built Vue.js library as a dependency. Here's a step-by-step guide on how to do it:
-
Install the new Vue.js application: If you haven't created the new Vue.js application yet, you can use Vue CLI to create a new project. Run the following command in your terminal:
vue create my-new-project
Follow the prompts to configure the project.
-
Install the built Vue.js library as a dependency: You can download the built Vue.js library from the official website (https://vuejs.org/v2/guide/installation.html#Runtime-only) or use a CDN link. In this example, we'll use the CDN link.
Open the
package.json
file of your new project and add the following line under the "dependencies" object:"vue": "^2.x.x"
Replace
^2.x.x
with the version number of the built Vue.js library you downloaded.Then, add the following line under the "scripts" object:
"install-vue": "cd node_modules/vue && npm install"
Save the file and run the following command to install the new dependency:
npm run install-vue
-
Configure the new application to use the built Vue.js library: Open the
main.js
file of your new project and replace the content with the following code:import Vue from 'vue' import App from './App.vue' Vue.config.productionTip = false new Vue({ render: h => h(App), el: '#app' }) // Add this line to import the built Vue.js library import 'vue'
Save the file.
-
Load the built Vue.js library: Open the
index.html
file of your new project and add the following line just before the closing</body>
tag:<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
Replace the CDN link with the path to the built Vue.js library if you downloaded it locally.
-
Build the new application: Run the following command to build the new application:
npm run build
Now, you have successfully loaded a Vue.js build into another Vue.js application. The new application will use the built Vue.js library instead of the one included in the Vue CLI.