NPM package: best practices and exposing multiple import paths

Question

I created an NPM package that uses Webpack and Babel for transpiling/bundling.

In my package.json, I've got main set to "main": "build/index.js". And in my Webpack config, I have entry set to entry: { app: './src/index.js' }. My entry file is shown below.

Everything works fine when the package is installed. However, with this setup, two import paths are exposed for every helper:

This is a problem for editors that support auto imports, since they will sometimes auto import from 'my-package/build/utils/helper1' rather than the preferred path of 'my-package'.

So, two questions:

1. Is there any way to prevent the longer import path from being exposed?
2. What is considered best practice when creating NPM packages. Is my setup acceptable, or should I be doing something different?

Entry File:

import helper1 from './utils/helper1';
import helper2 from './utils/helper2';

export {
  helper1,
  helper2,
};

const myPackage = {
  helper1,
  helper2,
};

export default myPackage;

Answer 1

1. you can utilize Webpack resolve
2. I often use the first way:

export {
  helper1,
  helper2,
};

Recently, I found that we can use Object.freeze() to export. This is a good article.