emulate obias changes in commit #169

package.json

@@ -65,6 +65,7 @@
   "scripts": {
     "generate-meta-tag": "node ./node_modules/react-cache-buster/dist/generate-meta-tag.js",
     "start": "webpack serve --mode development --port 3000 --open --hot --progress --host localhost --static .",
+    "start-remote-api": "webpack serve --config webpack.config_uat.js --mode development --port 3000 --open --hot --progress --host localhost --static .",
     "build": "npm run generate-meta-tag && npm run build-app",
     "build-app": "webpack --config webpack.config_prod.js",
     "test": "react-scripts test",

src/axios.js

@@ -2,7 +2,7 @@ var axios = require("axios");
 export const baseURL =
   // "https://www2.zuugle.at/api";
   window.location.host.indexOf("localhost") >= 0
-    ? "http://localhost:8080/api"
+    ? process.env.REACT_APP_API_URL
     : `${window.location.protocol}//${window.location.host}/api`;
 
 let axiosInstance = axios.create({

webpack.config.js

@@ -96,7 +96,7 @@ module.exports = {
 			attributes: {},
 		}),
 		new webpack.DefinePlugin({
-			"process.env.API_URL": JSON.stringify("http://localhost:8080/api"),
+			"process.env.REACT_APP_API_URL": JSON.stringify("http://localhost:8080/api"),
 		}),
 	],
 };

webpack.config_uat.js

@@ -0,0 +1,102 @@
+const webpack = require("webpack");
+const path = require("path");
+const HtmlWebpackPlugin = require("html-webpack-plugin");
+const CopyWebpackPlugin = require("copy-webpack-plugin");
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+
+const BUILD_DIR = path.resolve(__dirname, "build");
+
+module.exports = {
+	mode: "development",
+	output: {
+		path: BUILD_DIR,
+		filename: "./app_static/[name].bundle.js",
+	},
+
+	devServer: {
+		static: BUILD_DIR,
+		// directory: BUILD_DIR,
+		// staticOptions: {
+		//   setHeaders: (res, path) => {
+		//     if (path.endsWith('.json')) {
+		//       res.setHeader('Content-Type', 'application/javascript');
+		//     }
+		//   },
+		// },
+		// staticOptions: {
+		//   setHeaders: (res, path) => {
+		//     if (path.endsWith('.json')) {
+		//       res.setHeader('Content-Type', 'text/html');
+		//     }
+		//   },
+		// },
+
+		compress: true,
+		open: true,
+		historyApiFallback: true,
+	},
+	module: {
+		rules: [
+			{
+				test: /\.(js|jsx)$/,
+				exclude: /node_modules/,
+				use: {
+					loader: "babel-loader",
+					options: {
+						presets: [["@babel/preset-env", { targets: "defaults" }]],
+					},
+				},
+			},
+			{
+				test: /\.html$/,
+				loader: "html-loader",
+			},
+			{
+				test: /\.(scss)$/,
+				loader: "css-loader",
+			},
+			{
+				test: /\.css$/i,
+				use: [MiniCssExtractPlugin.loader, "css-loader"],
+			},
+			{
+				test: /\.svg$/i,
+				issuer: /\.[jt]sx?$/,
+				use: ["@svgr/webpack", "url-loader"],
+			},
+			{
+				test: /\.(png|jpg|jpeg|gif|ico)$/,
+				use: [
+					{
+						loader: "file-loader",
+						options: {
+							name: "./img/[name].[hash].[ext]",
+						},
+					},
+				],
+			},
+			{
+				test: /\.js$/,
+				enforce: "pre",
+				use: ["source-map-loader"],
+			},
+		],
+	},
+	plugins: [
+		new webpack.HotModuleReplacementPlugin(),
+		new HtmlWebpackPlugin({
+			inject: true,
+			template: "./public/index.html",
+		}),
+		new CopyWebpackPlugin({
+			patterns: [{ from: "./public", to: "app_static" }],
+		}),
+		new MiniCssExtractPlugin({
+			filename: "./app_static/[name].styles.css",
+			attributes: {},
+		}),
+		new webpack.DefinePlugin({
+			"process.env.REACT_APP_API_URL": JSON.stringify("https://www2.zuugle.at/api"),
+		}),
+	],
+};