Skip to content

Cannot use import statement outside a module. /Users/vagrant/git/node_modules/react-native-bundle-discovery-rozenite-plugin/dist/react-native.js:1 import fs from "fs"; #8

@cris7hian30-df

Description

@cris7hian30-df

I have this problen with android build and metro config with rozenite

> Task :app:createBundleQaReleaseJsAndAssets FAILED
[dotenv@17.3.1] injecting env (116) from .env -- tip: ⚙️  write to custom object with { processEnv: myObject }
[dotenv@17.3.1] injecting env (0) from .env -- tip: ⚙️  enable debug logging with { debug: true }
error Error loading Metro config at: /Users/vagrant/git/metro.config.js
Cannot use import statement outside a module.
/Users/vagrant/git/node_modules/react-native-bundle-discovery-rozenite-plugin/dist/react-native.js:1
import fs from "fs";
^^^^^^
SyntaxError: Cannot use import statement outside a module
    at wrapSafe (node:internal/modules/cjs/loader:1378:20)
    at Module._compile (node:internal/modules/cjs/loader:1428:41)
    at Module._extensions..js (node:internal/modules/cjs/loader:1548:10)
    at Module.load (node:internal/modules/cjs/loader:1288:32)
    at Module._load (node:internal/modules/cjs/loader:1104:12)
    at Module.require (node:internal/modules/cjs/loader:1311:19)
    at require (node:internal/modules/helpers:179:18)
    at Object.<anonymous> (/Users/vagrant/git/metro.config.js:16:5)
    at Module._compile (node:internal/modules/cjs/loader:1469:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1548:10)
[Incubating] Problems report is available at: file:///Users/vagrant/git/android/build/reports/problems/problems-report.html
FAILURE: Build failed with an exception.

My implementation

const sharedModulesMetroConfig = require('./sharedModulesMetroConfig');
const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');
// In React Native 0.72, we've changed the config loading setup for Metro in React Native CLI.
// The base React Native Metro config is now explicitly required and extended here
// in your project's Metro config file, giving you full control over the final config.
// In addition, this means that standalone Metro CLI commands, such as metro
// get-dependencies will work. We've also cleaned up the leftover defaults.
const checkInvalidDateFnsLocales = require('./fnsLocalizationConfig/locales/checkInvalidDateFnsLocales.js');
require('dotenv').config();
const { withRozenite } = require('@rozenite/metro');
const {
  withRozeniteReduxDevTools,
} = require('@rozenite/redux-devtools-plugin/metro');
const {
  withRozeniteBundleDiscoveryPlugin,
} = require('react-native-bundle-discovery-rozenite-plugin');

const { forbiddenLocales } = checkInvalidDateFnsLocales();

const defaultConfig = getDefaultConfig(__dirname);

// Extract blockList patterns to pass to shared modules config
const blockListPatterns = forbiddenLocales.map(
  (locale) =>
    new RegExp(`node_modules[/\\\\]date-fns[/\\\\]locale[/\\\\]${locale}`)
);

const initialConfig = {
  /**
   * Metro configuration for React Native
   * https://facebook.github.io/metro/docs/configuration
   *
   * @type {import('@react-native/metro-config').MetroConfig}
   *
   * @format
   */
  resolver: {
    blockListPatterns,
    // Prefer CJS exports to avoid TypeBox ESM runtime error after RN 0.81 update.
    unstable_conditionNames: ['react-native', 'require'],
  },
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: true,
      },
    }),
    assetPlugins: defaultConfig.transformer?.assetPlugins || [],
  },
};

function exclusionList(patterns) {
  if (!patterns || patterns.length === 0) {
    return /$^/;
  }
  return new RegExp(patterns.map((p) => p.source).join('|'));
}

const config = sharedModulesMetroConfig(initialConfig);

const finalConfig = withRozenite(mergeConfig(defaultConfig, config), {
  enabled: process.env.WITH_ROZENITE === 'true',
  enhanceMetroConfig: (metroConfig) => {
    let nextConfig = withRozeniteReduxDevTools(metroConfig);

    nextConfig = withRozeniteBundleDiscoveryPlugin(nextConfig, {
      includeCode: true,
      projectRoot: __dirname,
    });

    return nextConfig;
  },
});

if (!finalConfig.transformer) {
  finalConfig.transformer = {};
}
if (!Array.isArray(finalConfig.transformer.assetPlugins)) {
  finalConfig.transformer.assetPlugins =
    defaultConfig.transformer?.assetPlugins || [];
}

module.exports = finalConfig;

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions