morlay / babel-plugin-typescript-iife-enum

9 stars 0 forks source link

Can't make it work #20

Open slavafomin opened 4 years ago

slavafomin commented 4 years ago

Hello!

Thank you for this promising plugin!

However, I can't make it work, I'm not sure if I'm doing something wrong, could you please elaborate on the configuration?

I have two source files:

// index.ts

import { name } from './names';

console.log('Hello ' + name + '!');
// names.ts

export const name = 'John';

export enum Names {
  FATHER = 'Homer',
  SON = 'Bart',
  DAUGHTER = 'Lisa',
}

As you can see, I'm not using Names in my index.ts. But for some reason the enum is still added to the resulting bundle:

    __webpack_require__.r(__webpack_exports__);
    let Names;
    !function(Names) {
      Names.FATHER = "Homer";
      Names.SON = "Bart";
      Names.DAUGHTER = "Lisa";
    }(Names || (Names = {}));
    console.log("Hello John!");

Here's my Webpack config:

const path = require('path');

module.exports = {
  entry: './src/index.ts',
  mode: 'production',

  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist'),
  },

  resolve: {
    extensions: ['.ts', '.js'],
  },

  module: {
    rules: [
      {
        test: /\.ts$/,
        include: path.resolve(__dirname, 'src'),
        use: {
          loader: 'babel-loader',
          options: {
            presets: [
              '@babel/preset-typescript',
            ],
            plugins: [
              'babel-plugin-typescript-iife-enum',
            ],
          }
        }
      }
    ]
  },

};

I'm using latest versions of all packages.

Am I doing something wrong? Thanks!

slavafomin commented 4 years ago

Also, do you think it could be used with ts-loader?

dosentmatter commented 4 years ago

Also, do you think it could be used with ts-loader?

It is a babel plugin so it can't be used with ts-loader. You can maybe use it alongside ts-loader, but that still doesn't really make any sense, since you probably don't want to compile TypeScript with both babel and tsc.

Also, I'm not sure if @morlay's package is intended for minifiers to be able to remove and inline the enum instead of generating and IIFE. He said the extra IIFE makes it more "friendly" for uglify, but I'm not really sure what that means. I can't seem to figure out how an extra wrapping IIFE helps in minification. If anything, it can add more output.

Since his package works with regular enum and not const enum, I think the point isn't to inline the enum. Perhaps, he ran into some issue with uglify parsing the IIFE (not "friendly") so he wrote a babel plugin to allow it to work.

morlay commented 4 years ago

@dosentmatter sorry to reply so late.

it not works with preset-typescript, because the enum is already transformed to some object (by plugin-transform-typescript).

so the configruation should be

plugins: [
     [pluginTypescriptIifeEnum],
     [pluginTransformTypescript, { isTSX: true }],
     [pluginTransformReactJSX], 
]

https://github.com/querycap/devkit/blob/master/%40querycap-dev/babel-preset/index.ts#L33-L35

const enum is hard to handle in babel crossing files. In babel context, it focus one single file. if we have to handle const enum, we have to resolve relatived files, may with cache but i don't want to do that.

when object tree-shaking is ready, https://github.com/rollup/rollup/issues/2201 i think we could transform enum to pure object