Load plugin using babel-loader

[dariye]

Having issues loading babel-plugin-import using the modifyWebpackConfig function. It is a modular import library. I want to use it to import antd modules(like so)

My kyt.config.js file.

// Base kyt config.
// Edit these properties to make changes.


modifyWebpackConfig: (baseConfig, options) => {
  /* *
  * Add Plugins 
  */

  const babelLoader = baseConfig.module.rules.find(loader => loader.loader === 'babel-loader');
  babelLoader.options.plugins.push(["import", { libraryName: "antd", style: "css" }]);

  return baseConfig;
}

module.exports = {
  reactHotLoader: true,
  debug: false,
};

[tizmagik]

Hey @PaulTheAlien sorry you're having trouble! What is the error you get? Do you have a repo we could check out and reproduce the issue?

[dariye]

@tizmagik thanks for getting back. There's no error per se just that it isn't loading the compiled assets.

Here's a screenshot

I guess I'm wondering if there's another way to add a plugin.

[tizmagik]

Without having a sample repo to check out, it's hard to say what's going on. But, if what you've pasted is your kyt.config.js file then it doesn't look quite right, make sure that your modifyWebpackConfig function is defined as part of module.exports:

module.exports = {
  reactHotLoader: true,
  debug: false,
  modifyWebpackConfig: (baseConfig, options) => {
    const babelLoader = baseConfig.module.rules.find(loader => loader.loader === 'babel-loader');
    babelLoader.options.plugins.push(["import", { libraryName: "antd", style: "css" }]);

    return baseConfig;
  }
};

[dariye]

@tizmagik thank you that worked. I'll go ahead and close this. Awesome library by the way!

[jaredmcdonald]

@PaulTheAlien - also wanted to note that we are evaluating some options to make babel configuration smoother, take a look at #250 and #134