2.1.1. Приложение Sass не загружается

Question

У меня небольшое приложение, работающее с act-scripts-ts (3.1.0) и node-sass (4.10.0).

КогдаЯ импортирую, скажем "./ App.scss" ошибка импорта не отображается - но стили не добавляются.Ни импорт как модуль, ни импорт регулярно не работают.

• Если я пытаюсь импортировать файл, который не работает create-реакции-приложение выдает ошибку.
• Если я пытаюсь импортировать обычный файл CSS, стили применяются регулярно.

Есть идеи?: \

---

Package.json dump:

{
  "name": "reason-md-webapp",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@veracity/ui-react": "0.2.66396",
    "bootstrap": "3.3.7",
    "node-sass": "4.10.0",
    "react": "16.6.3",
    "react-bootstrap": "0.31.5",
    "react-dom": "16.6.3",
    "react-redux": "5.1.1",
    "react-router-bootstrap": "0.24.4",
    "react-router-dom": "4.2.2",
    "react-router-redux": "5.0.0-alpha.8",
    "react-scripts-ts": "3.1.0",
    "redux": "3.7.2",
    "redux-thunk": "2.2.0",
    "rimraf": "2.6.2"
  },
  "scripts": {
    "start": "react-scripts-ts start",
    "build": "react-scripts-ts build",
    "test": "react-scripts-ts test --env=jsdom",
    "eject": "react-scripts-ts eject"
  },
  "devDependencies": {
    "@types/enzyme": "3.1.6",
    "@types/enzyme-adapter-react-16": "1.0.1",
    "@types/jest": "23.3.9",
    "@types/node": "10.12.6",
    "@types/react": "16.7.6",
    "@types/react-dom": "16.0.9",
    "@types/react-redux": "6.0.9",
    "@types/react-router-dom": "4.3.1",
    "@types/redux-logger": "3.0.5",
    "enzyme": "3.2.0",
    "enzyme-adapter-react-16": "1.1.0",
    "enzyme-to-json": "3.3.0",
    "prettier": "1.15.2",
    "react-router-test-context": "0.1.0",
    "redux-logger": "3.0.6",
    "tslint-config-prettier": "1.16.0",
    "typescript": "3.1.6"
  }
}

Answer 1

Проблема была с response-scripts-ts .Я не совсем уверен, как я понял это в решении.

Новая проблема при использовании обычных response-scripts заключается в том, что псевдонимы веб-пакетов больше не разрешены.Yikes ..

Новый package.json dump (добавлено свойство esLintConfig и переключено реагировать-скрипты-ts с реагировать-скрипты):

{
  "name": "reason-md-webapp",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@veracity/ui-react": "0.2.66396",
    "bootstrap": "3.3.7",
    "react-bootstrap": "0.31.5",
    "react-router-bootstrap": "0.24.4",
    "react": "^16.6.3",
    "react-app-polyfill": "0.1.3",
    "react-dom": "^16.6.3",
    "react-scripts": "2.1.1",
    "react-redux": "5.1.1",
    "react-router-dom": "4.2.2",
    "typescript": "3.1.6",
    "node-sass": "4.10.0",
    "redux": "3.7.2",
    "redux-thunk": "2.2.0",
    "react-router-redux": "5.0.0-alpha.8"
  },
  "devDependencies": {
    "@types/enzyme": "3.1.6",
    "@types/enzyme-adapter-react-16": "1.0.1",
    "@types/jest": "23.3.9",
    "@types/node": "10.12.6",
    "@types/react": "16.7.6",
    "@types/react-dom": "16.0.9",
    "@types/react-redux": "6.0.9",
    "@types/react-router-dom": "4.3.1",
    "@types/redux-logger": "3.0.5",
    "enzyme": "3.2.0",
    "enzyme-adapter-react-16": "1.1.0",
    "enzyme-to-json": "3.3.0",
    "prettier": "1.15.2",
    "react-router-test-context": "0.1.0",
    "redux-logger": "3.0.6",
    "tslint-config-prettier": "1.16.0",
    "typescript": "3.1.6"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

Answer 2

Лучшим решением будет следовать этим инструкциям из официальной документации. Попробуйте воспроизвести этот шаг за шагом: CRA DOCS

Сначала установите node-sass и убедитесь, что он сохранен в зависимостях вашего проекта, затем переименуйте App.css в App.scss и включите его в файл JavaScript точки входа index.js. Иногда вам нужно поиграть с файлом index.css - удалите его и обязательно удалите все импортированные в этот файл файлы из других файлов .js.