Я создал очень простое приложение React и установил его в подпапку веб-сайта IIS10.
Проблема в том, что нет никакого способа сказать, что он должен принимать статические ресурсы, фрагменты пакетов js и css в этой папке, а не непосредственно в корне.
Я добавил значение домашней страницы в package.json и базовое имя в BrowserRouter, как описано здесь: https://reactrouter.com/web/api/BrowserRouter, но это не работает.
Это код в app.jsx:
import * as React from 'react';
import '@brains/ui/src/globals/scss/styles.scss';
import './fontawesome/all.css'
import './App.css';
import MyComponent from './MyComponent';
import { BrowserRouter, Route, Switch } from "react-router-dom";
function App() {
return (
<BrowserRouter basename = "/mySubFolder">
<Switch>
<Route
exact
path = "/"
render = {(props) => <MyComponent {...props} />}
/>
</Switch>
</BrowserRouter>
)
}
export default App;
Я поставил сборку на сервер, но приложение React всегда ищет статические файлы в www.mydomain.com/static/.. . вместо www.mydomain.com/mysubfolder/static/...
Что еще я могу попробовать?
Если вы используете приложение create-react-app, все статические файлы обычно обслуживаются с использованием переменной среды PUBLIC_URL
. Таким образом, вы должны иметь возможность установить его вручную с помощью файла .env
или с помощью EXPORT
(или в зависимости от того, что эквивалентно вашей ОС), поэтому вы получите следующее:
PUBLIC_URL=www.mydomain.com/mysubfolder/
Это должно сделать все статические файлы, обслуживаемые из www.mydomain.com/mysubfolder/static/...
, такими, как вы хотите. Подробнее об этом можно прочитать здесь: https://create-react-app.dev/docs/using-the-public-folder/
React-router не влияет на статическое обслуживание файлов. Он используется только для маршрутизации страниц.