@grafana/toolkit: webpack extend TS→JS (#21176)

packages/grafana-toolkit/README.md

@@ -129,23 +129,20 @@ Currently we support following Jest configuration properties:
 
 ### How can I customize Webpack rules or plugins?
 You can provide your own webpack configuration.
-Provide a function implementing `CustomWebpackConfigurationGetter` in a file named `webpack.config.ts`.
+Provide a function implementing `CustomWebpackConfigurationGetter` in a file named `webpack.config.js`.
 
 You can import the correct interface and Options from `@grafana/toolkit/src/config`.
 
 Example
 
-``` ts
-import { CustomWebpackConfigurationGetter } from '@grafana/toolkit/src/config'
+```js
 import CustomPlugin from 'custom-plugin';
 
-const getWebpackConfig: CustomWebpackConfigurationGetter = (defaultConfig, options) => {
+export const getWebpackConfig = (defaultConfig, options) => {
     console.log('Custom config');
     defaultConfig.plugins.push(new CustomPlugin())
     return defaultConfig;
-}
-
-export = getWebpackConfig;
+};
 ```
 
 ### How can I style my plugin?

packages/grafana-toolkit/src/config/mocks/webpack/overrides/webpack.config.js

@@ -0,0 +1,10 @@
+'use strict';
+const {cloneDeep} = require('lodash');
+
+const overrideWebpackConfig = (originalConfig, options) => {
+  const config = cloneDeep(originalConfig);
+  config.name = 'customConfig';
+  return config;
+};
+
+module.exports = overrideWebpackConfig;

packages/grafana-toolkit/src/config/mocks/webpack/overrides/webpack.config.ts

@@ -1,10 +0,0 @@
-import { CustomWebpackConfigurationGetter } from '../../../webpack.plugin.config';
-import _ from 'lodash';
-
-const overrideWebpackConfig: CustomWebpackConfigurationGetter = (originalConfig, options) => {
-  const config = _.cloneDeep(originalConfig);
-  config.name = 'customConfig';
-  return config;
-};
-
-export = overrideWebpackConfig;

packages/grafana-toolkit/src/config/mocks/webpack/overridesNamedExport/webpack.config.js

@@ -0,0 +1,8 @@
+'use strict';
+const {cloneDeep} = require('lodash');
+
+module.exports.getWebpackConfig = (originalConfig, options) => {
+  const config = cloneDeep(originalConfig);
+  config.name = 'customConfig';
+  return config;
+};

packages/grafana-toolkit/src/config/mocks/webpack/overridesNamedExport/webpack.config.ts

@@ -1,8 +0,0 @@
-import { CustomWebpackConfigurationGetter } from '../../../webpack.plugin.config';
-import _ from 'lodash';
-
-export const getWebpackConfig: CustomWebpackConfigurationGetter = (originalConfig, options) => {
-  const config = _.cloneDeep(originalConfig);
-  config.name = 'customConfig';
-  return config;
-};

packages/grafana-toolkit/src/config/mocks/webpack/unsupportedOverride/webpack.config.js

@@ -1,7 +1,5 @@
 /* WRONG CONFIG ON PURPOSE - DO NOT COPY THIS */
 
-const config = {
+module.exports.config = {
   name: 'test',
 };
-
-export = config;

packages/grafana-toolkit/src/config/webpack.plugin.config.ts

@@ -235,7 +235,7 @@ const getBaseWebpackConfig: WebpackConfigurationGetter = async options => {
 
 export const loadWebpackConfig: WebpackConfigurationGetter = async options => {
   const baseConfig = await getBaseWebpackConfig(options);
-  const customWebpackPath = path.resolve(process.cwd(), 'webpack.config.ts');
+  const customWebpackPath = path.resolve(process.cwd(), 'webpack.config.js');
 
   try {
     await accessPromise(customWebpackPath);