Question

我已经开始研究reactJS。我正在观看一个教程，其中将Css分别传递给jsx组件，但我尝试这样做但失败了。没有错误，但是CSS的更改尚未实现。

此后，我什至安装了装载机，但未得到任何结果

npm i css-loader style-loader --save-dev

yarn add --dev css-loader style-loader

App.js

import React, { Component } from 'react';
import{Form, FormControl, Button} from 'react-bootstrap';
import './App.css';

class App extends Component{
  render(){

      return(                      
       <div ClassName = "App">             
          <Form inline>
             <h2>Input your Birthday! </h2>
             <FormControl type = "date">
             </FormControl>
             {' '}
             <Button>
               Submit
             </Button>
          </Form>
     </div>      
    )
  }
}

export default App;

App.css

.App{
    padding: 5%;
    text-align: center;
    font-size: 16px;

}

index.js

import React from 'react';   
import ReactDOM from 'react-dom'; 

ReactDOM.render( 
  <App />, document.getElementById("root")                                                                                                       
)

Answer 1

首先，您需要将App.js导入index.js（我不知道为什么它没有引发错误）。其次，对于样式，我尝试将类名称从“ App”更改为“ app”，现在可以正常使用了。我不确定原因，但可能与保留“ App”有关。 Here是代码沙箱

无法在react.js的jsx组件中导入css

1 个答案: