TIL chaining Vue 3 Main.js

POSTED ON: Sep 13, 2020

TAGS: vue js

Pretty newbie unknown.

When you scaffold a Vue 3 project, your main js file looks like this.

Within main.js:

import { createApp } from "vue";
import App from "./App.vue";

createApp(App).mount("#app");

But let's say you wanted to get axios or whatever plugin included.
Axios-vue wants:

import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'

const app = Vue.createApp(...)
app.use(VueAxios, axios)

It's essentially chaining commands.
So to make it follow that Vue 3 pattern that was established:

import { createApp } from 'vue'
import App from './App.vue'
import axios from 'axios'
import VueAxios from 'vue-axios'

createApp(App).use(VueAxios, axios).mount("#app");

Via:
https://stackoverflow.com/a/64273694/4096078

Related TILs

Tagged: vue

• Next: TIL Deleting Object Properties and Shallow CopyShallow copy objects to safely delete properties
• Previous: TIL about the bullet ::markerWhen you have a list element, you had to hack the css to change bullet items. Not anymore!