How to override Webpack config?

[goodwin64]

Hi! Thanks for the package, it's really useful 👍 I want to override the Webpack config (add the resolve option) like mentioned here: https://preactjs.com/guide/v10/getting-started/#aliasing-react-to-preact

How can I do that? I don't see such a possibility inside the createWebpackConfig function for now.

[goodwin64]

Seems like I've found an ad-hoc solution:

const webpackConfig = createWebpackConfig({
    buildConfig: {
        ...DEFAULT_BUILD_CONFIG({
            rootDir: AppRootPath.path,
            id: U.id,
            now: new Date(),
        }),
        sassVariables: { CONFIG, SITE },
    },
    metadata: METADATA,
    metadataSchema: DEFAULT_METADATA_SCHEMA,
    env: process.env,
});

webpackConfig.resolve = {
    ...webpackConfig.resolve,
    alias: {
        ...(webpackConfig.resolve && webpackConfig.resolve.alias),
        "react": "preact/compat",
        "react-dom/test-utils": "preact/test-utils",
        "react-dom": "preact/compat",
    }
};

[SimonAlling]

Hi! Glad you like the package! :slightly_smiling_face:

You have essentially found the intended way to do it. I made the design choice that createWebpackConfig need not be completely parameterized, since the object it returns need not be used verbatim anyway. I would do basically what you've done, just a little more expression- and less statement-oriented:

const webpackConfig = createWebpackConfig({
    // ...
});

export default {
    ...webpackConfig,
    resolve: {
        ...webpackConfig.resolve,
        alias: {
            ...webpackConfig.resolve?.alias,
            "react": "preact/compat",
            "react-dom/test-utils": "preact/test-utils",
            "react-dom": "preact/compat",
        },
    },
};

I don't think you need the && check if you use ?.. :slightly_smiling_face:

I think it would be nice to document this, so I'm leaving the issue open.

[goodwin64]

Lovely! Thanks, I'll use your solution.

[SimonAlling]

I believe this was solved by #19.