From 10eb151a368dfaa52c07ca4540afa42fa5f8c3c5 Mon Sep 17 00:00:00 2001 From: blam Date: Tue, 13 Apr 2021 14:51:34 +0200 Subject: [PATCH] chore: updated some more things to get webpack working Signed-off-by: blam --- .../src/lib/bundler/LinkedPackageResolvePlugin.ts | 4 ++-- packages/cli/src/lib/bundler/backend.ts | 2 +- packages/cli/src/lib/bundler/config.ts | 14 ++++++++++++-- packages/cli/src/lib/bundler/optimization.ts | 4 ++-- packages/cli/src/lib/bundler/server.ts | 4 ++-- packages/cli/src/lib/bundler/transforms.ts | 8 ++++---- 6 files changed, 23 insertions(+), 13 deletions(-) diff --git a/packages/cli/src/lib/bundler/LinkedPackageResolvePlugin.ts b/packages/cli/src/lib/bundler/LinkedPackageResolvePlugin.ts index aa6a6b4e2e..91615eddee 100644 --- a/packages/cli/src/lib/bundler/LinkedPackageResolvePlugin.ts +++ b/packages/cli/src/lib/bundler/LinkedPackageResolvePlugin.ts @@ -15,14 +15,14 @@ */ import { resolve as resolvePath } from 'path'; -import { ResolvePlugin } from 'webpack'; +import { WebpackPluginInstance } from 'webpack'; import { isChildPath } from '@backstage/cli-common'; import { LernaPackage } from './types'; // Enables proper resolution of packages when linking in external packages. // Without this the packages would depend on dependencies in the node_modules // of the external packages themselves, leading to module duplication -export class LinkedPackageResolvePlugin implements ResolvePlugin { +export class LinkedPackageResolvePlugin implements WebpackPluginInstance { constructor( private readonly targetModules: string, private readonly packages: LernaPackage[], diff --git a/packages/cli/src/lib/bundler/backend.ts b/packages/cli/src/lib/bundler/backend.ts index bddeac0de3..41ad76d2e5 100644 --- a/packages/cli/src/lib/bundler/backend.ts +++ b/packages/cli/src/lib/bundler/backend.ts @@ -32,7 +32,7 @@ export async function serveBackend(options: BackendServeOptions) { { poll: true, }, - (err: Error) => { + (err: Error | undefined) => { if (err) { console.error(err); } else console.log('Build succeeded'); diff --git a/packages/cli/src/lib/bundler/config.ts b/packages/cli/src/lib/bundler/config.ts index 9cfc0e9ed5..615a15d8b6 100644 --- a/packages/cli/src/lib/bundler/config.ts +++ b/packages/cli/src/lib/bundler/config.ts @@ -161,12 +161,22 @@ export async function createConfig( performance: { hints: false, // we check the gzip size instead }, - devtool: isDev ? 'cheap-module-eval-source-map' : 'source-map', + devtool: isDev ? 'eval-cheap-module-source-map' : 'source-map', context: paths.targetPath, entry: [require.resolve('react-hot-loader/patch'), paths.targetEntry], resolve: { extensions: ['.ts', '.tsx', '.mjs', '.js', '.jsx'], mainFields: ['browser', 'module', 'main'], + fallback: { + module: false, + dgram: false, + dns: false, + fs: false, + http2: false, + net: false, + tls: false, + child_process: false, + }, plugins: [ new LinkedPackageResolvePlugin(paths.rootNodeModules, externalPkgs), new ModuleScopePlugin( @@ -249,7 +259,7 @@ export async function createBackendConfig( performance: { hints: false, // we check the gzip size instead }, - devtool: isDev ? 'cheap-module-eval-source-map' : 'source-map', + devtool: isDev ? 'eval-cheap-module-source-map' : 'source-map', context: paths.targetPath, entry: [ 'webpack/hot/poll?100', diff --git a/packages/cli/src/lib/bundler/optimization.ts b/packages/cli/src/lib/bundler/optimization.ts index e97b2ae868..f42018e522 100644 --- a/packages/cli/src/lib/bundler/optimization.ts +++ b/packages/cli/src/lib/bundler/optimization.ts @@ -14,14 +14,14 @@ * limitations under the License. */ -import { Options } from 'webpack'; +import { WebpackOptionsNormalized } from 'webpack'; import TerserPlugin from 'terser-webpack-plugin'; import { BundlingOptions } from './types'; import { isParallelDefault } from '../parallel'; export const optimization = ( options: BundlingOptions, -): Options.Optimization => { +): WebpackOptionsNormalized['optimization'] => { const { isDev } = options; return { diff --git a/packages/cli/src/lib/bundler/server.ts b/packages/cli/src/lib/bundler/server.ts index 088128c805..d39c77bfcd 100644 --- a/packages/cli/src/lib/bundler/server.ts +++ b/packages/cli/src/lib/bundler/server.ts @@ -45,8 +45,8 @@ export async function serveBundle(options: ServeOptions) { const server = new WebpackDevServer(compiler, { hot: !process.env.CI, contentBase: paths.targetPublic, - contentBasePublicPath: config.output?.publicPath, - publicPath: config.output?.publicPath, + contentBasePublicPath: config.output?.publicPath as string, + publicPath: config.output?.publicPath as string, historyApiFallback: { // Paths with dots should still use the history fallback. // See https://github.com/facebookincubator/create-react-app/issues/387. diff --git a/packages/cli/src/lib/bundler/transforms.ts b/packages/cli/src/lib/bundler/transforms.ts index 6eb4920326..41ca6b4e2e 100644 --- a/packages/cli/src/lib/bundler/transforms.ts +++ b/packages/cli/src/lib/bundler/transforms.ts @@ -14,13 +14,13 @@ * limitations under the License. */ -import webpack, { Module, Plugin } from 'webpack'; +import webpack, { ModuleOptions, WebpackPluginInstance } from 'webpack'; import MiniCssExtractPlugin from 'mini-css-extract-plugin'; import { svgrTemplate } from '../svgrTemplate'; type Transforms = { - loaders: Module['rules']; - plugins: Plugin[]; + loaders: ModuleOptions['rules']; + plugins: WebpackPluginInstance[]; }; type TransformOptions = { @@ -105,7 +105,7 @@ export const transforms = (options: TransformOptions): Transforms => { }, ]; - const plugins = new Array(); + const plugins = new Array(); if (isDev) { plugins.push(new webpack.HotModuleReplacementPlugin());