Блог

Я только начинаю работу над своим первым приложением Angular 2, но у меня возникли некоторые проблемы.

Моя среда разработки — WebStorm, и я сгенерировал проект с помощью Angular CLI

Моя проблема возникает при попытке использовать Material Design Lite.

Я импортировал три зависимости в свой index.html:

 <link rel="stylesheet" href="../../node_modules/material-design-lite/material.min.css">
<script src="../../node_modules/material-design-lite/material.min.js"></script>
<link rel="stylesheet" href="../../node_modules/material-design-icons/iconfont/material-icons.css">
  

Однако после вызова ng-serve в браузере все три приводят к ошибке не удалось загрузить ресурс.

Есть идеи, как это решить?

ПРИМЕЧАНИЕ: index.html находится в папке приложения, расположенной в папке src в папке моего проекта

Вы не должны ссылаться на зависимости таким образом. вы должны установить их с помощью

 npm i material-design-lite
  

а затем в вашем angular-cli.json вы добавляете его в стили или скрипты.

т.е.

 {
  "project": {
    "version": "1.0.0-beta.16",
    "name": "test"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": "assets",
      "index": "index.html",
      "main": "main.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.json",
      "prefix": "app",
      "mobile": false,
      "styles": [
         "../node_modules/material-design-lite/material.min.css",
          "../node_modules/material-design-icons/iconfont/material-icons.css"

      ],
      "scripts": [
        "../node_modules/material-design-lite/material.min.js"
      ],