Readdy Write  
0,00 €
Your View Money
Views: Count
Self 20% 0
Your Content 60% 0

Users by Links 0
u1*(Content+Views) 10% 0
Follow-Follower 0
s2*(Income) 5% 0

Count
Followers 0
Login Register as User

Gelöst: SharePoint Style Element wird nicht angezeigt

16.03.2020 (👁11216)

Problem: SharePoint Style wird nicht angezeigt

Problem:

Styles Elemente werden nicht angezeigt in React / VS Code

Fehlermeldung

Property 'list1' does not exist on type '{ webPart01: string; container: string; row: string..

 

Lösung:

Man muss gulp build starten, damit die Elemente in den anderen Dateien sichtbar werden

Wenn man Styles in SharePoint Webparts verwenden möchte, dann schreibt man die styles in einer style Datei mit der Endung .module.css zusammen.

Anschließend bindet man die styles Datei ein mit import.

import styles from './components/WebPart01.module.scss'

 

Und später wird auf die ausgelagerten Styles zugegriffen mit

class="${styles.listItem}">

dabei wird die Auswahl der möglichen Style-Elemente per Intellisense angezeigt

  private _renderList(itemsISPList[]): void {

    let htmlstring = '';

    items.forEach((itemISPList=> {

      html += `

    <ul class="${styles.list}">

      <li class="${styles.listItem}">

        <span class="ms-font-l">${item.Title}</span>

      </li>

    </ul>`;

    });

  

    const listContainerElement = this.domElement.querySelector('#spListContainer');

    listContainer.innerHTML = html;

  }

Problem:

Fehlermeldung

Property 'list1' does not exist on type '{ webPart01: string; container: string; row: string; column: string; 'ms-Grid': string; title: string; subTitle: string; description: string; button: string; test: string; label: string; list: string; listItem: string; }'. Did you mean 'list'?"

Lösung:

Die style Elemente werden erst erkannt, wenn man gulp serve in vs code->NPM SCRIPTS laufen lässt

Gesamte Fehlermeldung

Fehlermeldung

{

            "resource": "/c:/_Daten/Desktop/Demo/SharePoint/WebParts/Demos/src/webparts/webPart01/WebPart01WebPart.ts",

            "owner": "typescript",

            "code": "2551",

            "severity": 8,

            "message": "Property 'list1' does not exist on type '{ webPart01: string; container: string; row: string; column: string; 'ms-Grid': string; title: string; subTitle: string; description: string; button: string; test: string; label: string; list: string; listItem: string; }'. Did you mean 'list'?",

            "source": "ts",

            "startLineNumber": 117,

            "startColumn": 25,

            "endLineNumber": 117,

            "endColumn": 30,

            "relatedInformation": [

                        {

                                   "startLineNumber": 15,

                                   "startColumn": 3,

                                   "endLineNumber": 15,

                                   "endColumn": 24,

                                   "message": "'list' is declared here.",

                                   "resource": "/c:/_Daten/Desktop/Demo/SharePoint/WebParts/Demos/src/webparts/webPart01/components/WebPart01.module.scss.ts"

                        }

            ]

}