Brojd/plugin fixes (#3943)

# What this PR does

## Which issue(s) this PR fixes

## Checklist

- [x] Unit, integration, and e2e (if applicable) tests updated
- [x] Documentation added (or `pr:no public docs` PR label added if not
required)
- [x] `CHANGELOG.md` updated (or `pr:no changelog` PR label added if not
required)

grafana-plugin/package.json

@@ -19,8 +19,8 @@
     "test:e2e:gen": "yarn playwright codegen http://localhost:3000",
     "e2e-show-report": "yarn playwright show-report",
     "generate-types": "cd ./src/network/oncall-api/types-generator && yarn generate",
-    "dev": "webpack -c ./.config/webpack/webpack.config.ts --env development",
-    "watch": "webpack -w -c ./.config/webpack/webpack.config.ts --env development",
+    "dev": "webpack -c ./webpack.config.ts --env development",
+    "watch": "webpack -w -c ./webpack.config.ts --env development",
     "sign": "npx --yes @grafana/sign-plugin@latest",
     "start": "yarn watch",
     "plop": "plop",

grafana-plugin/webpack.config.ts

@@ -1,7 +1,11 @@
-import type { Configuration } from 'webpack';
+import { Configuration, DefinePlugin, EnvironmentPlugin } from 'webpack';
+import LiveReloadPlugin from 'webpack-livereload-plugin';
 import { mergeWithRules, CustomizeRule } from 'webpack-merge';
+
 import grafanaConfig from './.config/webpack/webpack.config';
 
+const dotenv = require('dotenv');
+
 const config = async (env): Promise<Configuration> => {
   const baseConfig = await grafanaConfig(env);
   const customConfig = {
@@ -24,6 +28,15 @@ const config = async (env): Promise<Configuration> => {
     watchOptions: {
       ignored: ['**/node_modules/', '**/dist'],
     },
+    plugins: [
+      new EnvironmentPlugin({
+        ONCALL_API_URL: null,
+      }),
+      new DefinePlugin({
+        'process.env': JSON.stringify(dotenv.config().parsed),
+      }),
+      ...(env.development ? [new LiveReloadPlugin({ appendScriptTag: true, useSourceHash: true })] : []),
+    ],
   };
 
   return mergeWithRules({
@@ -33,6 +46,7 @@ const config = async (env): Promise<Configuration> => {
         use: CustomizeRule.Merge,
       },
     },
+    plugins: CustomizeRule.Replace,
     watchOptions: {
       use: CustomizeRule.Merge,
     },