css - React App On Heroku - CSS 样式在移动设备上不生效-6ren

css - React App On Heroku - CSS 样式在移动设备上不生效

转载作者：行者123 更新时间：2023-11-27 23:39:12

问题

我有一个部署到 Heroku 的 React 应用程序，它使用 create-react-app 在后台执行所有捆绑。

我正在使用用 Typescript 编写的 Node.js 后端运行 Node 版本 10.15.3

当我在本地开发我的网站时一切正常。我运行 npm start，网站正常运行，如下所示:

该网站在登台和制作方面看起来也一样。

但是当我在我的移动设备上查看该网站时，我看到:

我已经联系了 Heroku 支持人员，他们告诉我他们不知道发生了什么。

对于使用 Ruby 的人来说，似乎所有在线问题都已解决，而且我还没有看到使用 React 的人遇到过这个问题。

构建文件夹中存在所有正确的文件。

此外，这是我的 index.js:

import LoadingIndicator from './components/elements/LoadingIndicator';
import { PersistGate } from 'redux-persist/integration/react';
import { persistStore, persistReducer } from 'redux-persist';
import { BrowserRouter as Router } from "react-router-dom";
import { StripeProvider } from 'react-stripe-elements';
import storage from 'redux-persist/lib/storage';
import * as Environment from './Environment';
import App from './components/App';
import ReactDOM from 'react-dom';
import React from 'react';
import './index.css';

import { Provider } from 'react-redux';
import middleware from './middleware';
import rootReducer from './reducers';
import { createStore } from 'redux';

const persistConfig = {
  key: 'app',
  storage
}

const persistedReducer = persistReducer(persistConfig, rootReducer);

const store = createStore(persistedReducer, middleware);
const persistor = persistStore(store);

ReactDOM.render(
  <Provider store={store}>
    <PersistGate loading={<LoadingIndicator />} persistor={persistor}>
      <StripeProvider apiKey={Environment.get("STRIPE_PUBLIC_KEY")}>
        <Router>
          <App />
        </Router>
      </StripeProvider>
    </PersistGate>
  </Provider>,
  document.getElementById('root')
);