Metro extended @expo/metro-config with sass & svg transformers

Question

我无法在使用expo创建的React Native项目中运行eas build -p android。这就是我得到的：

看起来您使用的是一个自定义的metro.config.js，它没有扩展@expo/metro-config。

我的metro.config.js文件：

const { getDefaultConfig } = require('@expo/metro-config');
module.exports = (async () => {
const {
resolver: { sourceExts, assetExts }
} = await getDefaultConfig(__dirname);
return {
transformer: {
babelTransformerPath: require.resolve('./transformersBundle.js')
},
resolver: {
assetExts: assetExts.filter(
(ext) => ext !== 'svg' && ext !== 'scss'
),
sourceExts: [...sourceExts, 'svg', 'scss', 'sass']
}
};
})();

transformersBundle.js代码：

var sassTransformer = require('react-native-sass-transformer');
var svgTransformer = require('react-native-svg-transformer');
module.exports.transform = function ({ src, filename, options }) {
if (filename.endsWith('.scss') || filename.endsWith('.sass')) {
return sassTransformer.transform({ src, filename, options });
} /* if (filename.endsWith('.svg')) */ else {
return svgTransformer.transform({ src, filename, options });
}
};

Answer 1

您返回了一个新的配置，但必须对其进行扩展。类似这样的东西：

module.exports = (async () => {
const config = await getDefaultConfig(__dirname);
const { transformer, resolver } = config;
config.transformer = {
...transformer,
babelTransformerPath: require.resolve('./transformersBundle.js'),
};
config.resolver = {
...resolver,
assetExts: resolver.assetExts.filter((ext) => ext !== 'svg' && ext !== 'scss'),
sourceExts: [...resolver.sourceExts, 'svg', 'scss', 'sass'],
};
return config;
})();