Question: I need access to my `hostname` variable in every component.

Is it a good idea to put it inside `data`?

Am I right in understanding that if I do so, I will able to call it everywhere with `this.hostname`?

Answer: 
For any Single File Component users, here is how I set up global variable(s)

1. Assuming you are using Vue-Cli's webpack template
2. Declare your variable(s) in somewhere variable.js

```
 const shallWeUseVuex = false;

```
3. Export it in variable.js

```
 module.exports = { shallWeUseVuex : shallWeUseVuex };

```
4. `Require` and assign it in your vue file

```
 export default {
     data() {
         return {
             shallWeUseVuex: require('../../variable.js')
         };
     }
 }

```

Ref: <https://v2.vuejs.org/v2/guide/state-management.html#Simple-State-Management-from-Scratch>
A possibility is to declare the variable at the index.html because it is really global. It can be done adding a javascript method to return the value of the variable, and it will be READ ONLY.

An example of this solution can be found at this answer:
<https://stackoverflow.com/a/62485644/1178478>