我已经使用CRA (CREATE-REact-APP)
创建了react应用。我已经安装了node-sass
,并将App.css
重命名为App.scss
,并在App.js
中更新了其导入。现在在我的App.js
中,我只是想在一个部分中打印一些文本。
This is the link the repo,I am talking about. For your reference
node -v
v12.11.1和npm -v
6.11.3
App.js
import React from 'react';
import './App.scss';
import Section from 'react-bulma-components/lib/components/section';
function App() {
return (
<Section>
<div class="container">
<h1 class="title">
Hello World
</h1>
<p class="subtitle">
My first website with <strong>Bulma</strong>!
</p>
</div>
</Section>
);
}
export default App;
App.scss
@import 'react-bulma-components/src/index.sass';
package.json
{
"name": "just-trying","version": "0.1.0","private": true,"dependencies": {
"node-sass": "^4.13.0","react": "^16.11.0","react-bulma-components": "^3.1.3","react-dom": "^16.11.0","react-router-dom": "^5.1.2","react-scripts": "3.2.0"
},"scripts": {
"start": "react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject"
},"eslintConfig": {
"extends": "react-app"
},"browserslist": {
"production": [
">0.2%","not dead","not op_mini all"
],"development": [
"last 1 chrome version","last 1 firefox version","last 1 safari version"
]
},"devDependencies": {
"sass-loader": "^8.0.0"
}
}