小编New*_*Aeg的帖子

我收到此错误我使用 npx-create-react-app 创建了一个新项目，然后按照此处写下的说明进行操作：https : //react-bootstrap.github.io/getting-started/introduction 我已经安装使用：npm install react-bootstrap bootstrap。然后把 CDN 复制到我的 index.html

<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link
**rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
crossorigin="anonymous"
/>**
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

然后导入了：

import React from 'react';
import  {Grid}  from 'react-bootstrap';
import './App.css';

function App() {
  return (
    <div className="container">
        <Grid className ="purchase-card">
          <h1>Hello World</h1>
        </Grid>
    </div>
  );
}

export default App;

我已经尝试在 Google 上搜索解决方案和导入的变体（例如，从“react-bootstrap/Button”导入按钮），但我似乎找不到导致此问题的问题。

我一直试图弄清楚发生了什么但没有任何成功。我试过重新安装、更新 babel、更改脚本（我在寻找解决方案时发现的各种东西），但似乎没有任何效果。

我按照故事书指南，最初运行：

npx -p @storybook/cli sb init

然后yarn storybook得到这个错误：

./.storybook/generated-stories-entry.js] 1.41 KiB {main} [built] [failed] [1 error]
[./.storybook/preview.js-generated-config-entry.js] 1.41 KiB {main} [built] [failed] [1 error]
[./.storybook/storybook-init-framework-entry.js] 1.41 KiB {main} [built] [failed] [1 error]
[./node_modules/@storybook/addon-actions/dist/preset/addArgs.js] 2.41 KiB {vendors~main} [built]
[./node_modules/@storybook/addon-actions/dist/preset/addArgs.js-generated-other-entry.js] 2.24 KiB {vendors~main} [built]
[./node_modules/@storybook/addon-actions/dist/preset/addDecorator.js] 216 bytes {vendors~main} [built]
[./node_modules/@storybook/addon-actions/dist/preset/addDecorator.js-generated-other-entry.js] 2.25 KiB {vendors~main} [built]
[./node_modules/@storybook/addon-backgrounds/dist/preset/defaultParameters.js-generated-other-entry.js] 2.26 KiB {vendors~main} [built]
[./node_modules/@storybook/addon-docs/dist/frameworks/common/config.js-generated-other-entry.js] 2.25 KiB {vendors~main} [built]
[./node_modules/@storybook/addon-docs/dist/frameworks/react/config.js-generated-other-entry.js] 2.25 KiB {vendors~main} [built]
[./node_modules/@storybook/addon-links/dist/preset/addDecorator.js-generated-other-entry.js] 2.25 KiB {vendors~main} [built]
[./node_modules/@storybook/core/dist/server/common/polyfills.js] 120 bytes {vendors~main} …

我已经按照本指南进行操作：https://tailwindcss.com/docs/guides/remix 一步一步（当然，两次）。但没有任何作用。

我的 tailwind 配置 js 看起来像这样：

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['./app/**/*.{js,ts,jsx,tsx}'],
  theme: {
    extend: {},
  },
  plugins: [],
};

我的根：

import styles from './styles/app.css';

export function links() {
  return [{ rel: 'stylesheet', href: styles }];
}

我在 app 文件夹和我创建的 app.css 样式中创建了一个名为 styles 的新文件夹，其中包含以下内容：

@tailwind base;
@tailwind components;
@tailwind utilities;

我正在尝试设计我的index.tsx

export default function Index() {
  return (
    <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
      <h1 className='text-3xl font-bold text-blue-500 underline'>Hello world!</h1>
    </div>
  );
} …

我正在尝试创建一种费用管理器，但遇到一个问题，我提交的数字作为字符串而不是整数添加。我确保默认设置为整数而不是字符串。

“有问题的”部分是收入部分（我已突出显示）

应用程序：

import Outcome from "./components/Outcome";
import Income from "./components/Income";

const App = () => {
  const [sum, setSum] = useState(0);

  const onChangeHandlerOutcome = (value) => {
    setSum(sum - value);
  };

  const onChangeHandlerIncome = (value) => {
    setSum(sum + value);
  };

  return (
    <div>
      <Outcome onChangeHandlerOutcome={onChangeHandlerOutcome} />
      <Income onChangeHandlerIncome={onChangeHandlerIncome} />
      You have {sum}$!
    </div>
  );
};

export default App;

收入构成

const Income = (props) => {
  const [input, setInput] = useState(0);

  const setInputHandler = (e) => {
    e.preventDefault();
    setInput(e.target.value); …