Import Javascript ES6 without a name

Question

I am running Webpack, Babel and Vue.js, and I want to split my post file. I currently have an app.js file which is the starting point for my application.

I have some code snippets that I want to put in the bootstrap.js file that I want to include in my main app.js file, can I have a clean file to start with Vue and add components to it as I go.

Some examples of what I would like to put in my bootstrap.js file:

 import messagesNL from './translations/nl'; Vue.use(VeeValidate, { locale: 'nl', dictionary: { nl: { messages: messagesNL } } }); window.Vue = Vue; 

So many settings for plugins, global configuration, etc. I feel that this is not your typical module, and it’s difficult for me to create a module such as a structure for this file, so I mainly use it in the app.js file:

 import bootstrap from './bootstrap'; 

Having no idea whether this will work, it seems that it just imports everything neatly without my module exports {} syntax.

Now the bootstrap variable that I assigned to this file is not used in app.js , because it is only used to require that the file and my IDE look like "greys" so that I know that it is not used.

Is there any other syntax for this, so I don't need to give it a name? Is this approach suitable for splitting my file, or should I do something else?

I have not put it in the correct module yet, because then it will have its own local area, and I will not know how to configure Vue with all plugins, etc. If anyone has a better offer, I am open to it.

Greetings.

Answer 1

To include a file without importing anything, you can simply discard the <name> from part of the statement:

 import './bootstrap'; 

This will be done by the target module without affecting the scope of the active module, i.e. this type of import has no side effects.