Как добавить расширение в metro.config.js для Metro Bundler?

Question

Я пытаюсь связать markdown файлы без больших накладных расходов (т.е. не добавляя их вручную в пакеты ресурсов в Xcode и Android Studio, не используя сторонние зависимости).

Моя идея состояла в том, чтобы require() чтобы включить их, изменив настройки Metro Bundler в metro.config.js:

/**
 * Metro configuration for React Native
 * https://github.com/facebook/react-native
 *
 * @format
 */

module.exports = {
    transformer: {
        getTransformOptions: async () => ({
            transform: {
                experimentalImportSupport: false,
                inlineRequires: false,
            },
        }),
    },
    resolver: {
        assetExts: [`md`] // < include md
    }
};

К сожалению, metro bundler заменяет массив данных по умолчанию на то, что здесь установлено.

Я не хочу явно повторять список расширений активов по умолчанию, который содержит более 20 расширений файлов, тем более, что в противном случае я хочу придерживаться настроек по умолчанию. См.: https://github.com/facebook/metro/blob/master/packages/metro-config/src/defaults/defaults.js.

Присоединение к массиву тоже не работает.

Использование RN 0.59.3.

Что-то я пропускаю?

Answer 1

Нашел ответ о том, как включить значения по умолчанию здесь: /questions/35436611/zagruzka-resursa-s-polzovatelskim-rasshireniem-ne-rabotaet/49400617#49400617.

/**
 * Metro configuration for React Native
 * https://github.com/facebook/react-native
 *
 * @format
 */

// get defaults assetExts array
const defaultAssetExts = require("metro-config/src/defaults/defaults").assetExts;

module.exports = {
    transformer: {
        getTransformOptions: async () => ({
            transform: {
                experimentalImportSupport: false,
                inlineRequires: false,
            },
        }),
    },
    resolver: {
        assetExts: [
            ...defaultAssetExts, // <- array spreading defaults
            'md'
        ]
    }
};

Answer 2

Другой способ сделать это - использовать тот же синтаксис, что реагирует с native-svg-transformer.

1. Сделайте metro.config.js асинхронным
2. вызвать getDefaultConfig
3. Вытащите ключ assetExts

пример

const { getDefaultConfig } = require('metro-config')

module.exports = (async () => {
    const {
        resolver: { assetExts },
    } = await getDefaultConfig()
    return {
        transformer: {
            getTransformOptions: async () => ({
                transform: {
                    experimentalImportSupport: false,
                    inlineRequires: false,
                },
            }),
        },
        resolver: {
            assetExts: [...assetExts, 'md'],
        },
    }
})()