Rollup config build issue with supabase realtime
Unanswered
Barbary Lion posted this in #help-forum
Barbary LionOP
This my nextjs component where i am using supabase realtime
import { RealtimeClient } from '@supabase/realtime-js';
// import { storeMessageInDatabase } from '~/app/dashboard/[organization]/chatbots/[chatbot]/chat-history/components/chat/actions.server';
const NEXT_PUBLIC_CHATBOT_API_URL = process.env.NEXT_PUBLIC_CHATBOT_API_URL;
if (!NEXT_PUBLIC_CHATBOT_API_URL) {
throw new Error(
`The environment variable NEXT_PUBLIC_CHATBOT_API_URL is not set`,
);
}
// Initialize Supabase client
const supabase = new RealtimeClient(
process.env.NEXT_PUBLIC_SUPABASE_REALTIME_URL!,
{
params: {
apikey: process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY,
},
},
);
6 Replies
Barbary LionOP
It giving the issue without this supabase realtime i am able to bundle it
rollup config.mjs
import { parseArgs } from 'node:util';
import nodeResolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import babel from '@rollup/plugin-babel';
import replace from '@rollup/plugin-replace';
import tsConfigPaths from 'rollup-plugin-tsconfig-paths';
import typescript from '@rollup/plugin-typescript';
import terser from '@rollup/plugin-terser';
import injectProcessEnv from 'rollup-plugin-inject-process-env';
import postcss from 'rollup-plugin-postcss';
import { visualizer } from 'rollup-plugin-visualizer';
import nodePolyfills from 'rollup-plugin-polyfill-node';
import json from '@rollup/plugin-json';
import { config } from 'dotenv';
const args = parseArgs({
options: {
environment: {
type: 'string',
short: 'e',
default: 'development',
},
configuration: {
type: 'string',
short: 'c',
},
},
});
const env = args.values.environment;
let environmentVariablesPath = './.env';
const requiredEnvVariables = [
'NEXT_PUBLIC_CHATBOT_API_URL',
'WIDGET_CSS_URL',
'CHATBOT_SDK_NAME',
'WIDGET_SETTINGS_ENDPOINT',
'NEXT_PUBLIC_PYTHON_API',
'NEXT_PUBLIC_SITE_URL',
];
const ENV_VARIABLES = config({
path: environmentVariablesPath,
}).parsed;
const injectedEnvVariables = Object.fromEntries(
Object.entries(ENV_VARIABLES).filter(([key]) =>
requiredEnvVariables.includes(key),
),
);
export default {
input: 'packages/widget/Chatbot.tsx',
output: {
file: `public/${ENV_VARIABLES.CHATBOT_SDK_NAME}`,
format: 'iife',
sourcemap: false,
inlineDynamicImports: true,
globals: {
'react/jsx-runtime': 'jsxRuntime',
'react-dom/client': 'ReactDOM',
react: 'React',
},
},
plugins: [
json(),
tsConfigPaths({
tsConfigPath: './packages/widget/tsconfig.json',
}),
replace({ preventAssignment: true }),
typescript({
tsconfig: './packages/widget/tsconfig.json',
}),
nodeResolve({ extensions: ['.tsx', '.ts', '.jsx', '.js', '.json'] }),
babel({
babelHelpers: 'bundled',
presets: [
'@babel/preset-typescript',
['@babel/preset-react', { runtime: 'automatic' }],
],
extensions: ['.js', '.jsx', '.ts', '.tsx'],
}),
postcss({
config: {
path: './postcss.config.js',
},
extensions: ['.css'],
minimize: true,
extract: true,
inject: {
insertAt: 'top',
},
}),
commonjs(),
nodePolyfills({
exclude: ['crypto'],
}),
injectProcessEnv(injectedEnvVariables),
terser({
ecma: 2020,
mangle: { toplevel: true },
compress: {
module: true,
toplevel: true,
unsafe_arrows: true,
// drop_console: true,
// drop_debugger: true
},
output: { quote_style: 1 },
}),
visualizer(),
],
};
Error -
(!) "this" has been rewritten to "undefined"
https://rollupjs.org/troubleshooting/#error-this-is-undefined
node_modules/@opentelemetry/api/build/esm/metrics/NoopMeter.js
15: * limitations under the License.
16: */
17: var __extends = this && this.__extends || function () {
^
18: var extendStatics = function (d, b) {
19: extendStatics = Object.setPrototypeOf || {
...and 1 other occurrence
node_modules/@opentelemetry/api/build/esm/api/context.js
15: * limitations under the License.
16: */
17: var __read = this && this.__read || function (o, n) {
^
18: var m = typeof Symbol === "function" && o[Symbol.iterator];
19: if (!m) return o;
...and 3 other occurrences
node_modules/@opentelemetry/api/build/esm/api/diag.js
15: * limitations under the License.
16: */
17: var __read = this && this.__read || function (o, n) {
^
18: var m = typeof Symbol === "function" && o[Symbol.iterator];
19: if (!m) return o;
...and 3 other occurrences
...and 13 other files
(!) Circular dependencies
node_modules/zod-to-json-o-json-schema/dist/esm/parsers/branded.js -> node_modules/zod-to-json-schema/dist/esm/parseDef.js
node_modules/zod-to-json-schema/dist/esm/parseDef.js -> node_modules/zod-to-json-schema/dist/esm/parsers/catch.js -> node_modules/zod-to-json-schema/dist/esm/parseDef.js
...and 20 more
(!) Missing global variable names
https://rollupjs.org/configuration-options/#output-globals
Use "output.globals" to specify browser global variable names corresponding to external modules:
worker_threads (guessing "require$$2$3")
node:util (guessing "node_util")
created public/get-kiosk-chatbot.js in 30.8s
i already tried using context window and this it can resolve this undefined error but worker threads not working with it