repack
repack copied to clipboard
callstack
Happy for help: Getting the error "File artifacts/index.bundle for ios not found in compilation assets"
My project stack:
- TypeScript
- RN 0.71.12
- React Native Navigation
The JS code is transpiled to a folder named "./artifacts". I updated my "webpack.config.mjs" that the entry will be `'./artifacts/index.js'. Following that I get the following error: "File artifacts/index.bundle for ios not found in compilation assets"
What can be the reason for that? Happy for your help!
Full file:
import path from 'path';
import TerserPlugin from 'terser-webpack-plugin';
import * as Repack from '@callstack/repack';
/**
* More documentation, installation, usage, motivation and differences with Metro is available at:
* https://github.com/callstack/repack/blob/main/README.md
*
* The API documentation for the functions and plugins used in this file is available at:
* https://re-pack.netlify.app/
*/
/**
* Webpack configuration.
* You can also export a static object or a function returning a Promise.
*
* @param env Environment options passed from either Webpack CLI or React Native CLI
* when running with `react-native start/bundle`.
*/
export default (env) => {
const {
mode = 'development',
context = Repack.getDirname(import.meta.url),
entry = './artifacts/index.js',
platform = process.env.PLATFORM,
minimize = mode === 'production',
devServer = undefined,
bundleFilename = undefined,
sourceMapFilename = undefined,
assetsPath = undefined,
reactNativePath = new URL('./node_modules/react-native', import.meta.url)
.pathname,
} = env;
const dirname = Repack.getDirname(import.meta.url);
if (!platform) {
throw new Error('Missing platform');
}
/**
* Using Module Federation might require disabling hmr.
* Uncomment below to set `devServer.hmr` to `false`.
*
* Keep in mind that `devServer` object is not available
* when running `webpack-bundle` command. Be sure
* to check its value to avoid accessing undefined value,
* otherwise an error might occur.
*/
// if (devServer) {
// devServer.hmr = false;
// }
/**
* Depending on your Babel configuration you might want to keep it.
* If you don't use `env` in your Babel config, you can remove it.
*
* Keep in mind that if you remove it you should set `BABEL_ENV` or `NODE_ENV`
* to `development` or `production`. Otherwise your production code might be compiled with
* in development mode by Babel.
*/
process.env.BABEL_ENV = mode;
return {
mode,
/**
* This should be always `false`, since the Source Map configuration is done
* by `SourceMapDevToolPlugin`.
*/
devtool: false,
context,
/**
* `getInitializationEntries` will return necessary entries with setup and initialization code.
* If you don't want to use Hot Module Replacement, set `hmr` option to `false`. By default,
* HMR will be enabled in development mode.
*/
entry: [
...Repack.getInitializationEntries(reactNativePath, {
hmr: devServer && devServer.hmr,
}),
entry,
],
resolve: {
/**
* `getResolveOptions` returns additional resolution configuration for React Native.
* If it's removed, you won't be able to use `<file>.<platform>.<ext>` (eg: `file.ios.js`)
* convention and some 3rd-party libraries that specify `react-native` field
* in their `package.json` might not work correctly.
*/
...Repack.getResolveOptions(platform),
/**
* Uncomment this to ensure all `react-native*` imports will resolve to the same React Native
* dependency. You might need it when using workspaces/monorepos or unconventional project
* structure. For simple/typical project you won't need it.
*/
// alias: {
// 'react-native': reactNativePath,
// },
},
/**
* Configures output.
* It's recommended to leave it as it is unless you know what you're doing.
* By default Webpack will emit files into the directory specified under `path`. In order for the
* React Native app use them when bundling the `.ipa`/`.apk`, they need to be copied over with
* `Repack.OutputPlugin`, which is configured by default inside `Repack.RepackPlugin`.
*/
output: {
clean: true,
hashFunction: 'xxhash64',
path: path.join(dirname, 'build/generated', platform),
filename: 'index.bundle',
chunkFilename: '[name].chunk.bundle',
publicPath: Repack.getPublicPath({ platform, devServer }),
},
/**
* Configures optimization of the built bundle.
*/
optimization: {
/** Enables minification based on values passed from React Native CLI or from fallback. */
minimize,
/** Configure minimizer to process the bundle. */
minimizer: [
new TerserPlugin({
test: /\.(js)?bundle(\?.*)?$/i,
/**
* Prevents emitting text file with comments, licenses etc.
* If you want to gather in-file licenses, feel free to remove this line or configure it
* differently.
*/
extractComments: false,
terserOptions: {
format: {
comments: false,
},
},
}),
],
chunkIds: 'named',
},
module: {
/**
* This rule will process all React Native related dependencies with Babel.
* If you have a 3rd-party dependency that you need to transpile, you can add it to the
* `include` list.
*
* You can also enable persistent caching with `cacheDirectory` - please refer to:
* https://github.com/babel/babel-loader#options
*/
rules: [
{
test: /\.[jt]sx?$/,
include: [
/node_modules(.*[/\\])+react\//,
/node_modules(.*[/\\])+react-native/,
/node_modules(.*[/\\])+@react-native/,
/node_modules(.*[/\\])+@datadog/,
/node_modules(.*[/\\])+@native-html/,
/node_modules(.*[/\\])+native-base-shoutem-theme/,
/node_modules(.*[/\\])+rn-emoji-keyboard/,
/node_modules(.*[/\\])+rn-placeholder/,
/node_modules(.*[/\\])+@react-navigation/,
/node_modules(.*[/\\])+@react-native-community/,
/node_modules(.*[/\\])+@expo/,
/node_modules(.*[/\\])+pretty-format/,
/node_modules(.*[/\\])+metro/,
/node_modules(.*[/\\])+abort-controller/,
/node_modules(.*[/\\])+@callstack\/repack/,
/node_modules(.*[/\\])+@gorhom\/bottom-sheet/,
/node_modules(.*[/\\])+@gorhom\/portal/,
/node_modules(.*[/\\])+@segment\/analytics-react-native/,
],
use: 'babel-loader',
},
/**
* Here you can adjust loader that will process your files.
*
* You can also enable persistent caching with `cacheDirectory` - please refer to:
* https://github.com/babel/babel-loader#options
*/
{
test: /\.[jt]sx?$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
/** Add React Refresh transform only when HMR is enabled. */
plugins:
devServer && devServer.hmr
? ['module:react-refresh/babel']
: undefined,
},
},
},
/**
* This loader handles all static assets (images, video, audio and others), so that you can
* use (reference) them inside your application.
*
* If you wan to handle specific asset type manually, filter out the extension
* from `ASSET_EXTENSIONS`, for example:
* ```
* Repack.ASSET_EXTENSIONS.filter((ext) => ext !== 'svg')
* ```
*/
{
test: Repack.getAssetExtensionsRegExp(Repack.ASSET_EXTENSIONS),
use: {
loader: '@callstack/repack/assets-loader',
options: {
platform,
devServerEnabled: Boolean(devServer),
/**
* Defines which assets are scalable - which assets can have
* scale suffixes: `@1x`, `@2x` and so on.
* By default all images are scalable.
*/
scalableAssetExtensions: Repack.SCALABLE_ASSETS,
},
},
},
],
},
plugins: [
/**
* Configure other required and additional plugins to make the bundle
* work in React Native and provide good development experience with
* sensible defaults.
*
* `Repack.RepackPlugin` provides some degree of customization, but if you
* need more control, you can replace `Repack.RepackPlugin` with plugins
* from `Repack.plugins`.
*/
new Repack.RepackPlugin({
context,
mode,
platform,
devServer,
output: {
bundleFilename,
sourceMapFilename,
assetsPath,
},
}),
],
};
};
When running with metro, the bundle seems to do exists in this location. This is the path I see on Metro: "http://localhost:8081/artifacts/index.bundle//&platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=com.hibob.hibob:470495:36"
@oferRounds I'll try to look when I have some time available. Please create a reproduction repository so I can assess this as quickly as possible, thanks!
ahmm, I can try but not sure it will get reproduced. This is the full error bellow – any idea comes to mind?
File artifacts/index.bundle for ios not found in compilation assets {
reqId: 'req-6',
stack: 'Error: File artifacts/index.bundle for ios not found in compilation assets\n' +
' at /Users/ofer.morag/Documents/Projects/node_modules/@callstack/repack/dist/webpack/Compiler.js:174:20\n' +
' at /Users/ofer.morag/Documents/Projects/node_modules/@callstack/repack/dist/webpack/Compiler.js:83:52\n' +
' at Array.forEach (<anonymous>)\n' +
' at callPendingResolvers (/Users/ofer.morag/Documents/Projects/node_modules/@callstack/repack/dist/webpack/Compiler.js:83:32)\n' +
' at Worker.<anonymous> (/Users/ofer.morag/Documents/Projects/node_modules/@callstack/repack/dist/webpack/Compiler.js:104:9)\n' +
' at Worker.emit (node:events:513:28)\n' +
' at MessagePort.<anonymous> (node:internal/worker:233:53)\n' +
' at [nodejs.internal.kHybridDispatch] (node:internal/event_target:731:20)\n' +
' at exports.emitMessage (node:internal/per_context/messageport:23:28)',
type: 'Error'
}
⚠ [16:33:01.194Z][DevServer] Reply already sent {
reqId: 'req-6',
err: {
type: 'FastifyError',
message: 'Reply was already sent.',
stack: 'FastifyError: Reply was already sent.\n' +
' at Reply.send (/Users/ofer.morag/Documents/Projects/node_modules/@callstack/repack-dev-server/node_modules/fastify/lib/reply.js:128:26)\n' +
' at _Reply.notFound (/Users/ofer.morag/Documents/Projects/node_modules/@fastify/sensible/index.js:47:16)\n' +
' at Object.handler (file:///Users/ofer.morag/Documents/Projects/node_modules/@callstack/repack-dev-server/dist/plugins/compiler/compilerPlugin.js:75:22)',
name: 'FastifyError',
code: 'FST_ERR_REP_ALREADY_SENT',
statusCode: 500
}
}
Hey @oferRounds, the minimal reproduction repository would be of great help here.
What do you mean by, and how have you configured that:
The JS code is transpiled to a folder named "./artifacts".
In the pasted webpack config file, you're only specifying the entry point to be artifacts/index.js, is that correct?
Hey @RafikiTiki
yes, exactly – only specifying the entry point to be artifacts/index.js
This issue has been marked as stale because it has been inactive for 30 days. Please update this issue or it will be automatically closed in 14 days.
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
@oferRounds How is the code transpiled to artifacts/index.bundle? In the attached webpack config you're pointing webpack to this file as the entry, not the output.
What are you using before running webpack (and what's the reason) to transpile the code and put it in the artifacts/index.bundle?
This issue has been marked as stale because it has been inactive for 30 days. Please update this issue or it will be automatically closed in 14 days.
Hi @RafikiTiki! I’m sorry, I missed your reply!
I’m sorry, it was my mistake - my index.bundle is going to /build/generated/ios (for iOS), and /build/generated/android (for Android).
But my index.js is being put to artifacts folder
so should I leave my entry as is?
But looking again on my confing, I see that wrote entry = './artifacts/index.js' and not entry = './artifacts/index.bundle'
Now I get the following error:
[20:56:17.131Z][DevServer] Server listening at http://[::1]:8081
ℹ [20:56:22.003Z][DevServer] GET 200 /status request completed { responseTime: 5.6410839557647705 }
⇢ [20:56:22.579Z][LoggerPlugin] Compiling ios: 3% setup (watch run)
ℹ [20:56:22.680Z][DevServer] Hermes device connected { deviceId: 0 }
⇢ [20:56:23.679Z][LoggerPlugin] Compiling ios: 10% building (0/9 entries 8/9 dependencies 0/7 modules)
⇢ [20:56:25.880Z][LoggerPlugin] Compiling ios: 10% building (0/9 entries 9/9 dependencies 1/8 modules)
⇢ [20:56:27.208Z][LoggerPlugin] Compiling ios: 28% building (3/9 entries 380/448 dependencies 27/151 modules)
⇢ [20:56:29.416Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 761/861 dependencies 93/299 modules)
⇢ [20:56:32.397Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 1640/1700 dependencies 143/643 modules)
⇢ [20:56:34.326Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 2031/2200 dependencies 241/719 modules)
⇢ [20:56:39.358Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 2359/2400 dependencies 251/781 modules)
⇢ [20:56:40.764Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 2700/4166 dependencies 256/828 modules)
⇢ [20:56:43.132Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 4590/5000 dependencies 283/1082 modules)
⇢ [20:56:45.536Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 5800/6166 dependencies 357/1360 modules)
⇢ [20:56:48.438Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 6323/6400 dependencies 410/1475 modules)
⇢ [20:56:50.351Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 6903/7000 dependencies 504/1547 modules)
⇢ [20:56:51.703Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 7738/7900 dependencies 568/1613 modules)
⇢ [20:56:53.573Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 8195/8300 dependencies 611/1669 modules)
⇢ [20:56:55.292Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 9692/9800 dependencies 747/1949 modules)
⇢ [20:56:57.591Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 10595/10700 dependencies 1001/2085 modules)
⇢ [20:57:00.188Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 11592/11700 dependencies 1169/2260 modules)
⇢ [20:57:02.161Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 12100/12178 dependencies 1257/2358 modules)
⇢ [20:57:03.884Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 13300/13380 dependencies 1390/2578 modules)
⇢ [20:57:06.454Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 14376/14500 dependencies 1654/2837 modules)
⇢ [20:57:08.295Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 15100/15155 dependencies 1795/2952 modules)
⇢ [20:57:09.470Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 16100/16150 dependencies 2099/3103 modules)
⇢ [20:57:13.150Z][LoggerPlugin] Compiling ios: 40% building (5/9 entries 17797/17873 dependencies 2644/3621 modules)
⇢ [20:57:15.091Z][LoggerPlugin] Compiling ios: 46% building (6/9 entries 19640/19700 dependencies 3236/3876 modules)
⇢ [20:57:16.983Z][LoggerPlugin] Compiling ios: 65% building (9/9 entries 21503/21503 dependencies 4251/4251 modules)
⇢ [20:57:16.983Z][LoggerPlugin] Compiling ios: 65% building
node:internal/event_target:1096
process.nextTick(() => { throw err; });
^
Error [ERR_UNHANDLED_ERROR]: Unhandled error. ({})
at Compiler.emit (node:events:508:17)
at Worker.<anonymous> (/Users/ofer.morag/Documents/Projects/node_modules/@callstack/repack/dist/webpack/Compiler.js:110:14)
at Worker.emit (node:events:519:28)
at MessagePort.<anonymous> (node:internal/worker:263:53)
at [nodejs.internal.kHybridDispatch] (node:internal/event_target:822:20)
at exports.emitMessage (node:internal/per_context/messageport:23:28) {
code: 'ERR_UNHANDLED_ERROR',
context: {}
}
Node.js v21.5.0
Sorry, ignore the log above (it was with the wrong entryFile), this is the error I get:
[22:43:43.542Z][DevServer] Server listening at http://[::1]:8081
ℹ [22:43:48.063Z][DevServer] GET 200 /status request completed { responseTime: 4.819707989692688 }
ℹ [22:43:48.116Z][DevServer] GET 200 /status request completed { responseTime: 0.8382920026779175 }
⇢ [22:43:48.574Z][LoggerPlugin] Compiling ios: 3% setup (watch run)
ℹ [22:43:48.634Z][DevServer] Hermes device connected { deviceId: 0 }
⇢ [22:43:48.699Z][LoggerPlugin] Compiling ios: 16% building (1/9 entries 9/9 dependencies 0/7 modules)
⇢ [22:43:51.591Z][LoggerPlugin] Compiling ios: 16% building (1/9 entries 9/9 dependencies 1/7 modules)
⇢ [22:43:53.412Z][LoggerPlugin] Compiling ios: 34% building (4/9 entries 460/624 dependencies 40/179 modules)
⇢ [22:43:54.938Z][LoggerPlugin] Compiling ios: 40% building (5/9 entries 786/1100 dependencies 132/253 modules)
⇢ [22:43:58.212Z][LoggerPlugin] Compiling ios: 40% building (5/9 entries 1744/1800 dependencies 268/441 modules)
⇢ [22:43:59.492Z][LoggerPlugin] Compiling ios: 40% building (5/9 entries 1857/1900 dependencies 300/447 modules)
⇢ [22:44:02.456Z][LoggerPlugin] Compiling ios: 58% building (8/9 entries 2648/2648 dependencies 582/582 modules)
✖ [22:44:03.433Z][LoggerPlugin] Failed to build bundle due to errors
✖ [22:44:03.433Z][LoggerPlugin] Error in "undefined": Module not found: Error: Can't resolve './index.js' in '/Users/ofer.morag/Documents/Projects'
node:internal/event_target:1096
process.nextTick(() => { throw err; });
^
Error [ERR_UNHANDLED_ERROR]: Unhandled error. ({})
at Compiler.emit (node:events:508:17)
at Worker.<anonymous> (/Users/ofer.morag/Documents/Projects/node_modules/@callstack/repack/dist/webpack/Compiler.js:110:14)
at Worker.emit (node:events:519:28)
at MessagePort.<anonymous> (node:internal/worker:263:53)
at [nodejs.internal.kHybridDispatch] (node:internal/event_target:822:20)
at exports.emitMessage (node:internal/per_context/messageport:23:28) {
code: 'ERR_UNHANDLED_ERROR',
context: {}
}
This issue has been marked as stale because it has been inactive for 30 days. Please update this issue or it will be automatically closed in 14 days.
This issue has been automatically closed because it has been inactive for more than 14 days. Please reopen if you want to add more context.