With HappyPack · Issue #6 · Igorbek/typescript-plugin-styled-components (original) (raw)

@alteredtastes

Hi there @Igorbek - I'm having some issues setting this up but my team would love to have this improved debugging experience. We are not using hot reloading and we have ts-loader v3.1.1 with HappyPack. My configuration currently looks like..

const createStyledComponentsTransformer = require('typescript-plugin-styled-components').default;
const styledComponentsTransformer = createStyledComponentsTransformer({options: getStyledComponentDisplay});

function getStyledComponentDisplay(filename, bindingName) {
    return bindingName || makePascalCase(filename);
}

// webpack plugins...
plugins {
   typescriptTranspiler: function(workers) {
      return new HappyPack({
         id: 'ts',
         threads: workers,
         loaders: [
            {
               path: 'ts-loader',
               query: { happyPackMode: true },
               options: {
                getCustomTransformers: () => ({before: [styledComponentsTransformer]})
               }
            }
         ]
      })
   }

Is there something you see that is missing or problematic in this usage? I am seeing the build succeed but still with no bindingName/filenames on the generated html. Thanks for any help!