ES6 imports using module names without path

Question

I would like to be able to import my modules using just name without path.

For example, say I want to use:

import ViewportChecker from 'viewport-checker';

instead of

import ViewportChecker from '../ViewportChecker';

But I want to keep the file where it is and not create a new npm module of it. Would it be possible to define it as module for exmaple in package.json?

Answer 1

You can use webpack's alias feature : https://webpack.js.org/configuration/resolve/#resolve-alias

Answer 2

You can put a default file with naming convention of index.js which contains all the exports.

like:

-App
--home
---index.js // <--it will hold all the exports from otherClass.js and anotherClass.js
---otherClass.js
---anotherClass.js

Now you have to import just folder name and it will automatically search for index.js file to get the particular exported item.

It might look like this:

import Home from './home';