Develop

Dockerfile

@@ -3,5 +3,9 @@ WORKDIR /app
 COPY package*.json .
 RUN npm install
 COPY . .
+ARG VITE_BASE_URL
+ENV VITE_BASE_URL=$VITE_BASE_URL
+ARG VITE_API_URL
+ENV VITE_API_URL=$VITE_API_URL
 RUN npm run build
 CMD cp -r build result_build

README.md

@@ -60,6 +60,17 @@ npm ci
 npm run dev
 ```
 
+### Env
+
+Адреса приложения и API необходимо указать в файле **.env** в корне проекта.
+
+#### Пример .env файла
+
+```text
+VITE_BASE_URL=http://localhost:3000
+VITE_API_URL=http://localhost:3000/api
+```
+
 Подробная информация по работе с проектом в файле `CONTRIBUTE.MD`
 
 ## Ссылки

env.d.ts

@@ -1,5 +1,6 @@
 interface ImportMetaEnv {
 	VITE_API_URL: string;
+	VITE_BASE_URL: string;
 	NODE_ENV: string;
 	VITE_JWT_SECRET: string;
 	VITE_PORT: string;

src/components/product-card/index.tsx

@@ -87,7 +87,7 @@ const ProductCard: React.FC<ProductCardProps> = ({
 				<img
 					className={styles.image}
 					src={
-						cardImage !== undefined && cardImage !== null
+						cardImage
 							? cardImage.startsWith('/')
 								? `${BASE_URL}${cardImage}`
 								: cardImage

src/components/shopping-item/index.tsx

@@ -3,6 +3,7 @@ import styles from './shopping-item.module.scss';
 import { Link } from 'react-router-dom';
 import { useCart } from '@hooks/use-cart-context.ts';
 import { translateMeasureUnit } from '@utils/utils';
+import { BASE_URL } from '@data/constants';
 
 type ShoppingItemProps = {
 	product: {
@@ -44,7 +45,7 @@ const ShoppingItem: React.FC<ShoppingItemProps> = (props) => {
 			<Link to={`/catalog/${product.category}/${product.id}`}>
 				<img
 					className={styles.item__image}
-					src={`https://goodfood.acceleratorpracticum.ru/media/${product.photo}`}
+					src={`${BASE_URL}/media/${product.photo}`}
 					alt={product.name}
 				/>
 			</Link>

src/data/constants.ts

@@ -1,5 +1,5 @@
-export const BACKEND_URL = 'https://goodfood.acceleratorpracticum.ru/api';
-export const BASE_URL = 'https://goodfood.acceleratorpracticum.ru';
+export const BACKEND_URL = import.meta.env.VITE_API_URL;
+export const BASE_URL = import.meta.env.VITE_BASE_URL;
 
 export const URLS = {
 	SIGNUP: '/signup',

vite.config.ts

@@ -21,4 +21,8 @@ export default defineConfig({
 		},
 	},
 	plugins: [react(), svgr()],
+	define: {
+		VITE_BASE_URL: process.env.VITE_BASE_URL,
+		VITE_API_URL: process.env.VITE_API_URL,
+	},
 });