Skip to content

Instantly share code, notes, and snippets.

@marklawlor
Last active May 3, 2021 00:19
Show Gist options
  • Save marklawlor/82cf911cea27a4e118822395ae93ca7b to your computer and use it in GitHub Desktop.
Save marklawlor/82cf911cea27a4e118822395ae93ca7b to your computer and use it in GitHub Desktop.
diff --git a/node_modules/@expo/next-adapter/build/withExpo.js b/node_modules/@expo/next-adapter/build/withExpo.js
index 2e63eb4..b1cf9a9 100644
--- a/node_modules/@expo/next-adapter/build/withExpo.js
+++ b/node_modules/@expo/next-adapter/build/withExpo.js
@@ -7,8 +7,8 @@ function withExpo(nextConfig = {}) {
// Prevent define plugin from overwriting Next.js environment.
process.env.EXPO_WEBPACK_DEFINE_ENVIRONMENT_AS_KEYS = 'true';
const expoConfig = addons_1.withUnimodules(config, {
- projectRoot: nextConfig.projectRoot || process.cwd(),
- }, { supportsFontLoading: false });
+ projectRoot: nextConfig.projectRoot || process.cwd()
+ }, { supportsFontLoading: false, webpack5: (options.config.future || {}).webpack5 });
// Use original public path
(expoConfig.output || {}).publicPath = (config.output || {}).publicPath;
// TODO: Bacon: use commonjs for RNW babel maybe...
diff --git a/node_modules/@expo/webpack-config/webpack/addons/withUnimodules.js b/node_modules/@expo/webpack-config/webpack/addons/withUnimodules.js
index 67671c7..b023007 100644
--- a/node_modules/@expo/webpack-config/webpack/addons/withUnimodules.js
+++ b/node_modules/@expo/webpack-config/webpack/addons/withUnimodules.js
@@ -38,6 +38,7 @@ function withUnimodules(webpackConfig = {}, env = {}, argv = {}) {
webpackConfig.output = {};
// Attempt to use the input webpack config mode
env.mode = env.mode || webpackConfig.mode;
+ const isWebpack5 = argv.webpack5
const environment = env_1.validateEnvironment(env);
let { supportsFontLoading } = argv;
// If the args don't specify this then we'll check if the input already supports font loading.
@@ -105,7 +106,7 @@ function withUnimodules(webpackConfig = {}, env = {}, argv = {}) {
extensions: env_1.getModuleFileExtensions('web') });
// Transpile and remove expo modules from Next.js externals.
const includeFunc = babelLoader.include;
- webpackConfig = ignoreExternalModules(webpackConfig, includeFunc);
+ webpackConfig = ignoreExternalModules(webpackConfig, includeFunc, isWebpack5);
// Add a loose requirement on the ResizeObserver polyfill if it's installed...
webpackConfig = withEntry_1.default(webpackConfig, env, {
entryPath: 'resize-observer-polyfill/dist/ResizeObserver.global',
@@ -125,7 +126,7 @@ exports.default = withUnimodules;
* @param webpackConfig Config to be modified
* @param shouldIncludeModule A method that returns a boolean when the input module should be transpiled and externed.
*/
-function ignoreExternalModules(webpackConfig, shouldIncludeModule) {
+function ignoreExternalModules(webpackConfig, shouldIncludeModule, isWebpack5) {
if (!webpackConfig.externals) {
return webpackConfig;
}
@@ -136,6 +137,14 @@ function ignoreExternalModules(webpackConfig, shouldIncludeModule) {
if (typeof external !== 'function') {
return external;
}
+
+ if (isWebpack5) {
+ return ((ctx) => {
+ const relPath = path_1.default.join('node_modules', ctx.request);
+ return shouldIncludeModule(relPath) ? undefined : external(ctx);
+ })
+ }
+
return ((ctx, req, cb) => {
const relPath = path_1.default.join('node_modules', req);
return shouldIncludeModule(relPath) ? cb() : external(ctx, req, cb);
module.exports = {
presets: ['@expo/next-adapter/babel'],
plugins: ["@babel/plugin-proposal-class-properties"],
};
const { withExpo } = require("@expo/next-adapter");
const withTM = require("next-transpile-modules")(["@shared/components"]);
const withPlugins = require("next-compose-plugins");
module.exports = withPlugins([withTM, [withExpo, { projectRoot: __dirname }]], {
future: { webpack5: true },
});
"resolutions": {
"webpack": "^5",
"react": "17.0.1",
"react-dom": "17.0.1",
"html-webpack-plugin": "5.3.1"
},
@nandorojo
Copy link

nandorojo commented May 2, 2021

@marklawlor I notice that you aren't including expo packages or react-native-web in the modules to transpile. Is that what the JSX transform solves?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment