rm webpack stuff

This commit is contained in:
Oleksii Bulenok
2026-08-13 17:43:06 +02:00
parent ea29924531
commit 23c4b81d90
8 changed files with 5 additions and 400 deletions
+1 -1
View File
@@ -22,7 +22,7 @@ ENV CI=true
COPY . .
#
# Generate the JavaScript webpack. NOTE: this will change
# Generate the JavaScript bundle. NOTE: this will change
#
RUN mkdir --parents $NVM_DIR && \
wget \
-1
View File
@@ -41,7 +41,6 @@ module.exports = function (api) {
plugins: [
'@lingui/babel-plugin-lingui-macro',
['babel-plugin-react-compiler', {target: '19'}],
'module:react-native-dotenv', // used by web build! can remove when we drop webpack
[
'module-resolver',
{
+1 -8
View File
@@ -123,7 +123,6 @@
"@emoji-mart/react": "^1.1.1",
"@expo/html-elements": "^0.12.5",
"@expo/metro-runtime": "~57.0.8",
"@expo/webpack-config": "^19.0.1",
"@floating-ui/dom": "^1.6.3",
"@floating-ui/react-dom": "^2.0.8",
"@formatjs/intl-displaynames": "^7.3.9",
@@ -274,11 +273,9 @@
"@crowdin/cli": "^4.14.1",
"@lingui/babel-plugin-lingui-macro": "^5.9.2",
"@lingui/cli": "^5.9.2",
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
"@react-native/babel-preset": "0.86.0",
"@react-native/jest-preset": "0.86.0",
"@react-native/typescript-config": "^0.81.5",
"@sentry/webpack-plugin": "^3.2.2",
"@testing-library/react-native": "^13.2.0",
"@types/jest": "29.5.14",
"@types/lodash.chunk": "^4.2.7",
@@ -295,7 +292,6 @@
"eslint-plugin-bsky-internal": "link:lint-rules",
"eslint-plugin-react-native-a11y": "^3.5.1",
"eslint-plugin-simple-import-sort": "^13.0.0",
"file-loader": "6.2.0",
"globals": "^17.0.0",
"husky": "^9.1.7",
"is-ci": "^3.0.1",
@@ -306,12 +302,9 @@
"oxlint": "^1.73.0",
"oxlint-tsgolint": "^7.0.2001",
"prettier": "3.9.6",
"react-native-dotenv": "^3.4.11",
"react-refresh": "^0.14.0",
"svgo": "^4.0.2",
"ts-plugin-sort-import-suggestions": "^1.0.4",
"typescript": "npm:@typescript/typescript6@^6.0.2",
"webpack-bundle-analyzer": "^4.10.1"
"typescript": "npm:@typescript/typescript6@^6.0.2"
},
"jest": {
"preset": "jest-expo/ios",
+2 -2
View File
@@ -3,13 +3,13 @@ type MediaBunnyModule = typeof import('mediabunny')
let promise: Promise<MediaBunnyModule> | undefined
/**
* Lazily loads mediabunny into its own webpack chunk and caches the resulting
* Lazily loads mediabunny into its own async chunk and caches the resulting
* promise so the module is fetched at most once. If the import fails (e.g. a
* transient chunk-load error), the cached promise is reset so a later call can
* retry the load.
*/
export function loadMediaBunny(): Promise<MediaBunnyModule> {
promise ??= import(/* webpackChunkName: "mediabunny" */ 'mediabunny').catch(
promise ??= import('mediabunny').catch(
e => {
// reset so a later attempt can retry after a transient chunk-load failure
promise = undefined
+1 -1
View File
@@ -24,5 +24,5 @@
}
]
},
"exclude": ["bskyweb", "bskyembed", "web-build"]
"exclude": ["bskyweb", "bskyembed", "web-build", "dist"]
}
-199
View File
@@ -1,199 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="theme-color">
<!--
This viewport works for phones with notches.
It's optimized for gestures by disabling global zoom.
-->
<meta
name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, viewport-fit=cover"
/>
<!--
Preconnect to essential domains
-->
<link rel="preconnect" href="https://bsky.social">
<link rel="preconnect" href="https://go.bsky.app">
<title>%WEB_TITLE%</title>
<link rel="preload" as="font" type="font/woff2" href="/static/media/InterVariable.c504db5c06caaf7cdfba.woff2" crossorigin>
<link rel="stylesheet" href="/static/style.css">
<style>
/**
* Minimum styles required to render splash.
*
* ALL OTHER STYLES BELONG IN `src/style.css`
*
* THIS NEEDS TO BE DUPLICATED IN `bskyweb/templates/base.html`
*/
@font-face {
font-family: 'InterVariable';
src: url(/static/media/InterVariable.c504db5c06caaf7cdfba.woff2) format('woff2');
font-weight: 300 1000;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'InterVariableItalic';
src: url(/static/media/InterVariable-Italic.01dcbad1bac635f9c9cd.woff2) format('woff2');
font-weight: 300 1000;
font-style: italic;
font-display: swap;
}
html,
body {
margin: 0px;
padding: 0px;
font-family: InterVariable, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Liberation Sans', Helvetica, Arial, sans-serif;
text-rendering: optimizeLegibility;
/* Platform-specific reset */
-webkit-overflow-scrolling: touch;
-webkit-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-ms-overflow-style: scrollbar;
font-synthesis-weight: none;
}
:root {
--text: black;
--background: white;
--backgroundLight: #e2e7ee;
}
@media (prefers-color-scheme: dark) {
:root {
color-scheme: dark;
--text: white;
--background: black;
--backgroundLight: #232e3e;
}
}
html,
body,
#root {
display: flex;
flex: 1 0 auto;
min-height: 100%;
width: 100%;
}
html.theme--light,
html.theme--light body,
html.theme--light #root {
background-color: white;
--text: black;
--background: white;
--backgroundLight: #DCE2EA;
}
html.theme--dark,
html.theme--dark body,
html.theme--dark #root {
color-scheme: dark;
background-color: black;
--text: white;
--background: black;
--backgroundLight: #232E3E;
}
html.theme--dim,
html.theme--dim body,
html.theme--dim #root {
color-scheme: dark;
background-color: #151D28;
--text: white;
--background: #151D28;
--backgroundLight: #2C3A4E;
}
#splash {
display: flex;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
align-items: center;
justify-content: center;
}
#splash svg {
position: relative;
top: -50px;
width: 100px;
}
/**
* We need these styles to prevent shifting due to scrollbar show/hide on
* OSs that have them enabled by default. This also handles cases where the
* screen wouldn't otherwise scroll, and therefore hide the scrollbar and
* shift the content, by forcing the page to show a scrollbar.
*/
body {
width: 100%;
overflow-y: scroll;
}
</style>
<script>
const theme = localStorage.getItem('ALF_THEME')
if (theme) {
document.documentElement.classList.add(`theme--${theme}`)
}
</script>
</head>
<body>
<!--
A generic no script element with a reload button and a message.
Feel free to customize this however you'd like.
-->
<noscript>
<form
action=""
style="
background-color: #fff;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
"
>
<div
style="
font-size: 18px;
font-family: Helvetica, sans-serif;
line-height: 24px;
margin: 10%;
width: 80%;
"
>
<p lang="en">Oh no! It looks like JavaScript is not enabled in your browser.</p>
<p lang="en" style="margin: 20px 0;">
<button
type="submit"
style="
background-color: #4630eb;
border-radius: 100px;
border: none;
box-shadow: none;
color: #fff;
cursor: pointer;
font-weight: bold;
line-height: 20px;
padding: 6px 16px;
"
>
Reload
</button>
</p>
</div>
</form>
</noscript>
<!-- The root element for your Expo app. -->
<div id="splash">
<!-- Bluesky SVG -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 57"><path fill="#006AFF" d="M13.873 3.805C21.21 9.332 29.103 20.537 32 26.55v15.882c0-.338-.13.044-.41.867-1.512 4.456-7.418 21.847-20.923 7.944-7.111-7.32-3.819-14.64 9.125-16.85-7.405 1.264-15.73-.825-18.014-9.015C1.12 23.022 0 8.51 0 6.55 0-3.268 8.579-.182 13.873 3.805ZM50.127 3.805C42.79 9.332 34.897 20.537 32 26.55v15.882c0-.338.13.044.41.867 1.512 4.456 7.418 21.847 20.923 7.944 7.111-7.32 3.819-14.64-9.125-16.85 7.405 1.264 15.73-.825 18.014-9.015C62.88 23.022 64 8.51 64 6.55c0-9.818-8.578-6.732-13.873-2.745Z"/></svg>
</div>
<div id="root">
</div>
</body>
</html>
-20
View File
@@ -1,20 +0,0 @@
/*
* Replacement for react-native-reanimated's js-reanimated/webUtils.web.js,
* wired up via a webpack alias in webpack.config.js.
*
* The original file declares ES module exports but populates them with bare
* CommonJS `require()` calls wrapped in try/catch. Webpack parses the file as
* ESM and therefore leaves those `require`s untouched, so in the browser they
* throw ReferenceError, the try/catch swallows it, and createReactDOMStyle &
* co. stay undefined. That silently disables reanimated's DOM update path and
* _updatePropsJS later crashes with "Cannot convert undefined or null to
* object" on Object.keys(component.props). Importing the same react-native-web
* internals statically fixes the resolution.
*/
import createReactDOMStyle from 'react-native-web/dist/exports/StyleSheet/compiler/createReactDOMStyle'
import {
createTextShadowValue,
createTransformValue,
} from 'react-native-web/dist/exports/StyleSheet/preprocess'
export {createReactDOMStyle, createTextShadowValue, createTransformValue}
-168
View File
@@ -1,168 +0,0 @@
const path = require('path')
const createExpoWebpackConfigAsync = require('@expo/webpack-config')
const webpack = require('webpack')
const {withAlias} = require('@expo/webpack-config/addons')
const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin')
const {BundleAnalyzerPlugin} = require('webpack-bundle-analyzer')
const {sentryWebpackPlugin} = require('@sentry/webpack-plugin')
const {version} = require('./package.json')
const GENERATE_STATS = process.env.EXPO_PUBLIC_GENERATE_STATS === '1'
const OPEN_ANALYZER = process.env.EXPO_PUBLIC_OPEN_ANALYZER === '1'
const reactNativeWebWebviewConfiguration = {
test: /postMock.html$/,
use: {
loader: 'file-loader',
options: {
name: '[name].[ext]',
},
},
}
// Walk a rule tree and wrap source-map-loader's filterSourceMappingUrl to
// drop sourcemap references matching the given path pattern. Mutates in place.
function patchSourceMapFilter(rules, pathPattern) {
if (!rules) return
for (const rule of rules) {
if (!rule || typeof rule !== 'object') continue
if (rule.oneOf) patchSourceMapFilter(rule.oneOf, pathPattern)
if (rule.rules) patchSourceMapFilter(rule.rules, pathPattern)
const uses = Array.isArray(rule.use) ? rule.use : rule.use ? [rule.use] : []
for (const use of uses) {
if (!use?.loader?.includes('source-map-loader')) continue
const prev = use.options?.filterSourceMappingUrl
use.options = {
...use.options,
filterSourceMappingUrl(url, resourcePath) {
if (pathPattern.test(resourcePath)) return 'remove'
return prev ? prev(url, resourcePath) : true
},
}
}
}
}
module.exports = async function (env, argv) {
env.babel = {
dangerouslyAddModulePathsToTranspile: ['@bsky.app/expo'],
}
let config = await createExpoWebpackConfigAsync(env, argv)
/*
* Expo only registers its own internal config as a cache build dependency,
* so changes to this file (e.g. aliases) don't invalidate the persistent
* filesystem cache and stale module resolutions get reused. Register this
* file so edits here always bust the cache.
*/
if (config.cache?.buildDependencies) {
config.cache.buildDependencies.config = [
...(config.cache.buildDependencies.config || []),
__filename,
]
}
config = withAlias(config, {
'react-native$': 'react-native-web',
'react-native-webview': 'react-native-web-webview',
'react-native-gesture-handler': false, // RNGH should not be used on web, so let's cause a build error if it sneaks in
'@sentry-internal/replay': false, // not used, ~300kb of dead weight
/*
* @sentry/react-native's tracing integration probes for expo-router via a
* try/catch require(). We don't use expo-router, so the module can't
* resolve and webpack warns on every build. Stubbing it to an empty
* module makes the probe return null (`mod?.store ?? null`) silently.
*/
'expo-router/build/global-state/router-store': false,
/*
* react-native-svg's fetchData util imports the ~55KB `buffer` polyfill,
* but is only needed by SvgUri/SvgXml remote loading, which we don't use.
* Stubbing it out makes fetchText undefined, so it throws if ever called.
* The alias key must be an absolute path because the package imports it
* via a relative path internally.
*/
[path.join(
__dirname,
'node_modules/react-native-svg/lib/module/utils/fetchData',
)]: false,
/*
* reanimated's webUtils.web.js mixes ESM exports with bare CommonJS
* require() calls in try/catch, which webpack leaves untranspiled - they
* throw at runtime and createReactDOMStyle & co. silently stay undefined,
* making _updatePropsJS crash on every animated style update. The shim
* imports the same react-native-web internals statically. See the shim
* file for details.
*/
[path.join(
__dirname,
'node_modules/react-native-reanimated/lib/module/ReanimatedModule/js-reanimated/webUtils',
)]: path.join(__dirname, 'web/reanimatedWebUtilsShim.js'),
})
/*
* expo-font's serverContext.web.js imports `node:async_hooks` for SSR-only
* font collection, but webpack can't resolve `node:` URIs for web targets.
* Every call site is guarded by `typeof window === 'undefined'`, so in the
* browser bundle the module is dead code - strip the scheme prefix and stub
* the builtin out with an empty module.
*/
config.plugins.push(
new webpack.NormalModuleReplacementPlugin(
/^node:async_hooks$/,
resource => {
resource.request = 'async_hooks'
},
),
)
config.resolve.fallback = {...config.resolve.fallback, async_hooks: false}
// react-native-uuid ships sourceMappingURL comments but no .map files.
patchSourceMapFilter(config.module.rules, /react-native-uuid/)
config.module.rules = [
...(config.module.rules || []),
reactNativeWebWebviewConfiguration,
]
if (env.mode === 'development') {
config.plugins.push(new ReactRefreshWebpackPlugin())
// Reap zombie HMR WebSocket connections that linger after refresh.
// Without this, dead sockets exhaust the browser's per-origin connection
// pool and the dev server stops responding.
config.devServer.onListening = devServer => {
devServer.server.on('connection', socket => {
socket.setTimeout(10000)
socket.on('timeout', () => socket.destroy())
})
}
} else {
// Support static CDN for chunks
config.output.publicPath = 'auto'
}
if (GENERATE_STATS || OPEN_ANALYZER) {
config.plugins.push(
new BundleAnalyzerPlugin({
openAnalyzer: OPEN_ANALYZER,
generateStatsFile: true,
statsFilename: '../stats.json',
analyzerMode: OPEN_ANALYZER ? 'server' : 'json',
defaultSizes: 'parsed',
// reasons balloon stats.json past Node's max string length, breaking bundle-size-diff in CI
statsOptions: OPEN_ANALYZER ? null : {reasons: false},
}),
)
}
if (process.env.SENTRY_AUTH_TOKEN) {
config.plugins.push(
sentryWebpackPlugin({
org: 'blueskyweb',
project: 'app',
authToken: process.env.SENTRY_AUTH_TOKEN,
release: {
// fallback needed for Render.com deployments
name: process.env.SENTRY_RELEASE || version,
dist: process.env.SENTRY_DIST,
},
}),
)
}
return config
}