Как стилизовать реагирующий компонент с помощью CSS? - PullRequest
Новая
       22

Как стилизовать реагирующий компонент с помощью CSS?

0 голосов
/ 18 апреля 2019

Я пытаюсь стилизовать свой компонент приложения с помощью файла CSS, но каждый раз, когда он выдает ошибку, указывающую

Сбой при разборе модуля: неожиданный токен (1: 0) Возможно, вам нужен соответствующий загрузчикдля обработки файлов этого типа.

Я уже установил css-loader и style-loader и настроил в файле webpack.config.js.Также я выполнил команду npm install --save -dev css-loader style-loader, но в файле package.json оба появляются в зависимостях, а не в devDependencies.

My package.json: 

{
  "name": "reactapp",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --open --mode development",
    "build": "webpack --mode production"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@babel/core": "^7.4.3",
    "@babel/preset-env": "^7.4.3",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.5",
    "css-loader": "^2.1.1",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "style-loader": "^0.23.1",
    "webpack": "^4.30.0",
    "webpack-cli": "^3.3.0"
  },
  "devDependencies": {
    "html-loader": "^0.5.5",
    "html-webpack-plugin": "^3.2.0"
  }
}

webpack.config.js part: 

{
    test : /\.css$/,
    use:{
        loader:["style-loader","css-loader"]
    }

Журнал ошибок: 

ERROR in (webpack)-dev-server/client?http://localhost
Module build failed: Error: ENOENT: no such file or directory, open 'C:\Users\brew\Documents\reactApp\node_modules\webpack-dev-server\client\index.js'
 @ multi (webpack)-dev-server/client?http://localhost ./src main[0]

ERROR in ./src/app.css 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
> .app{
|     color: maroon;
|     font-size: 10px;
 @ ./src/App.js 20:0-19
 @ ./src/index.js
...