Transpiling all code in package regardless of webpack config

[conor909]

I have a shared UI library in my monorepo written in react native (web), and in my webpack config I have the blow code.

Webpack should ignore files such as index.tsx if index.web.tsx is a sibling file. But my case the transpiler is attempting to transpile native libraries imported into index.tsx when it shouldn't.

/** @type {import('next').NextConfig} */

const withFonts = require('next-fonts')
const withImages = require('next-images')
const withPlugins = require('next-compose-plugins')
const withTM = require('next-transpile-modules')([
  '@my/ui-library'
])

const nextConfig = {
  reactStrictMode: false,
  webpack5: true,
  swcMinify: true,
  webpack: (config) => {
    config.resolve.extensions = [
      '.web.ts',
      '.web.tsx',
      '.web.js',
      '.web.jsx',
      ...config.resolve.extensions,
    ]
    return config
  }
}

const transform = withPlugins([withTM, withFonts, withImages])

module.exports = function (name, { defaultConfig }) {
  return transform(name, {
    ...defaultConfig,
    ...nextConfig,
  })
}