使用 webpack 5 和 next js 12 獲取構建時間錯誤

Question

這是我們的 next.config.js 文件

const webpack = require('webpack');
// Initialize doteenv library
require('dotenv').config();

module.exports = {
  swcMinify: true,
  devIndicators: {
    autoPrerender: false,
  },
  compiler: {
    styledComponents: true, // ssr and displayName are configured by default
    removeConsole: true,
  },
  webpack: (config) => {
    config.plugins.push(new webpack.EnvironmentPlugin(process.env));
    config.module.rules.push({
      test: /\.svg$/,
      issuer: {
        and: [/\.(js|ts)x?$/],
      },
      use: ['@svgr/webpack'],
    });
    return config;
  },
  eslint: {
    // Warning: Dangerously allow production builds to successfully complete even if
    // your project has ESLint errors.
    // but we are running eslint separately, therefore no need to worry about disabling
    // ESLint on next build
    ignoreDuringBuilds: true,
  },
}

在構建時收到此錯誤/警告

DefinePlugin
Conflicting values for 'process.env.NEXT_RUNTIME'

當我嘗試使用 console.log 時，獲取NEXT_RUNTIME: 'nodejs'作為 process.env.NEXT_RUNTIME 的值

我們使用 SWC 作為編譯器而不是 babel。 知道如何解決這個問題嗎？

Answer 1

用DefinePlugin替換EnvironmentLogin為我修復了警告。

我希望這會有所幫助🤞

  webpack: (config, { dev, isServer }) => {
  // ...

  config.plugins.push(
    new webpack.DefinePlugin({
       'process.env.NODE_ENV': JSON.stringify(NODE_ENV) 
     }));

      return config;
    },