![Cloudflare Adds Security.txt Setup Wizard](https://cdn.sanity.io/images/cgdhsj6q/production/7cbc49090a3c7e26efac073373c3b5e7d298b9c3-1024x1024.webp?w=400&fit=max&auto=format)
Security News
Cloudflare Adds Security.txt Setup Wizard
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
@react-native/metro-config
Advanced tools
Metro configuration for React Native.
@react-native/metro-config is a configuration package for Metro, the JavaScript bundler used by React Native. It allows developers to customize the Metro bundler's behavior, such as transforming files, resolving modules, and optimizing the build process.
Custom Transformer
This feature allows you to specify a custom transformer for Metro. In this example, the configuration is set to use the 'react-native-typescript-transformer' to handle TypeScript files.
const { getDefaultConfig } = require('@react-native/metro-config');
const config = getDefaultConfig(__dirname);
config.transformer = {
babelTransformerPath: require.resolve('react-native-typescript-transformer')
};
module.exports = config;
Custom Resolver
This feature allows you to customize the resolver settings. In this example, the configuration is modified to include additional file extensions like 'ts' and 'tsx' for TypeScript support.
const { getDefaultConfig } = require('@react-native/metro-config');
const config = getDefaultConfig(__dirname);
config.resolver = {
sourceExts: ['jsx', 'js', 'ts', 'tsx']
};
module.exports = config;
Asset Plugins
This feature allows you to specify asset plugins for Metro. In this example, the configuration is set to use 'expo-asset/tools/hashAssetFiles' to handle asset files.
const { getDefaultConfig } = require('@react-native/metro-config');
const config = getDefaultConfig(__dirname);
config.transformer = {
assetPlugins: ['expo-asset/tools/hashAssetFiles']
};
module.exports = config;
Metro is the JavaScript bundler for React Native. It provides the core functionalities for bundling JavaScript code and assets. While @react-native/metro-config is specifically for configuring Metro, the 'metro' package itself includes the bundler and its core functionalities.
Haul is an alternative JavaScript bundler for React Native. It is highly customizable and integrates with Webpack, allowing developers to leverage the extensive Webpack ecosystem. Compared to @react-native/metro-config, Haul offers more flexibility through Webpack's configuration options.
Webpack is a popular JavaScript module bundler. While it is not specifically designed for React Native, it can be configured to work with React Native projects. Webpack offers a wide range of plugins and configuration options, making it a powerful alternative to Metro when used with the appropriate loaders and plugins.
yarn add --dev @react-native/js-polyfills metro-config @react-native/metro-babel-transformer metro-runtime @react-native/metro-config
Note: We're using yarn
to install deps. Feel free to change commands to use npm
3+ and npx
if you like
To run the tests in this package, run the following commands from the React Native root folder:
yarn
to install the dependencies. You just need to run this onceyarn jest packages/metro-config
.FAQs
Metro configuration for React Native.
The npm package @react-native/metro-config receives a total of 533,306 weekly downloads. As such, @react-native/metro-config popularity was classified as popular.
We found that @react-native/metro-config demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
Security News
The Socket Research team breaks down a malicious npm package targeting the legitimate DOMPurify library. It uses obfuscated code to hide that it is exfiltrating browser and crypto wallet data.
Security News
ENISA’s 2024 report highlights the EU’s top cybersecurity threats, including rising DDoS attacks, ransomware, supply chain vulnerabilities, and weaponized AI.