babel-plugin-transform-remove-imports icon indicating copy to clipboard operation
babel-plugin-transform-remove-imports copied to clipboard

Removing only side effects imports

Open slavafomin opened this issue 5 years ago • 13 comments

Hello!

Thank you for this great plugin!

However, I want to remove only side-effects imports that looks like this:

import 'something',

but not like these:

  • import { something } from 'something'
  • import something from 'something'

Is it possible?

Thanks!

slavafomin avatar Jun 18 '20 12:06 slavafomin

@slavafomin

You should choose prettier and ESLint to solve your problem.

Can meet your needs, but which one is correct to delete?

jaywcjlove avatar Jun 18 '20 12:06 jaywcjlove

@jaywcjlove I'm not sure I understand what linting tools have to do with built-time code transformations.

Right now, this plugin would delete imports in all formats, however, I want to delete only imports that looks like this: import 'something', i.e. imports that doesn't import any specific symbols.

slavafomin avatar Jun 18 '20 13:06 slavafomin

Following your notation it would be:

// Input Code
import 'foo';
import { Foo } from 'foo';
import Foo from 'foo';

// Output   ↓ ↓ ↓ ↓ ↓ ↓
import { Foo } from 'foo';
import Foo from 'foo';

slavafomin avatar Jun 18 '20 13:06 slavafomin

@slavafomin Upgrade + [email protected]

jaywcjlove avatar Jun 18 '20 15:06 jaywcjlove

I don't know if this is the feature you want.

jaywcjlove avatar Jun 18 '20 16:06 jaywcjlove

@jaywcjlove wow, that was quick, thank you. I will try it out.

slavafomin avatar Jun 19 '20 16:06 slavafomin

I've tried to use the following configuration:

    {
      loader: "babel-loader",
      options: {
        plugins: [
          [
            "babel-plugin-transform-remove-imports",
            {
              test: /^core-js\//,
              remove: 'effects',
            },
          ],
        ],
      },
    }

to remove imports that look like: import 'core-js/something';, but I'm getting the following built-time error message: SyntaxError: NodePath has been removed so is read-only, and I'm not sure why. Do you have any thoughts on this?

slavafomin avatar Jun 19 '20 16:06 slavafomin

@jaywcjlove actually, looking at your implementation I can see a small misunderstanding. I was hoping that remove: 'effects' would work with test option, so both criteria should be met in order for import to be removed.

slavafomin avatar Jun 19 '20 16:06 slavafomin

If you don't mind I would propose the following API:

    {
      loader: "babel-loader",
      options: {
        plugins: [
          [
            "babel-plugin-transform-remove-imports",
            {
              cases: [ // multiple cases could be specified
                {
                  test: /^core-js\//,
                  remove: "side-effects-only",
                },
                {
                  test: "foo", // string could be used
                  remove: "everything", // default
                },
              ],
            },
          ],
        ],
      },
    }

Such configuration format would allow to specify multiple cases and will allow extensibility in the future by extending the remove option.

A removeAll option could be used instead of cases.

slavafomin avatar Jun 19 '20 16:06 slavafomin

When the removeAll option exists, cases does not work? @slavafomin

jaywcjlove avatar Jun 20 '20 01:06 jaywcjlove

@jaywcjlove I believe that when removeAll option is used, the usage of cases should throw error to signify that those two options are mutually exclusive.

slavafomin avatar Jun 22 '20 12:06 slavafomin

@slavafomin Keep removeAll is compatible with previous versions

jaywcjlove avatar Jun 22 '20 12:06 jaywcjlove

is there away to prevent the remove of the import in certain files

BavlyAbdelmasih avatar Apr 04 '23 13:04 BavlyAbdelmasih