Modul nicht gefunden: Fehler: beheben kann nicht Modul 'fs' in

Question

Ich versuche ADAL JS Beispielcode zu integrieren:

https://github.com/AzureAD/azure-activedirectory-library-for-nodejs/blob/master/sample/client-credentials-sample.js

in eine Sharepoint-Framework Client webpart:

mein Code ist sehr

: einfach, ich schon mit NPM, adal, fs, node-fs usw.

However I see this error 

./~/adal-node/lib/util.js 
Module not found: Error: Cannot resolve module 'fs' in /Users/luis.valencia/Documents/GraphSamples/Sample1/node_modules/adal-node/lib 
resolve module fs in /Users/luis.valencia/Documents/GraphSamples/Sample1/node_modules/adal-node/lib 
    looking for modules in /Users/luis.valencia/Documents/GraphSamples/Sample1/node_modules/adal-node/lib 
    /Users/luis.valencia/Documents/GraphSamples/Sample1/node_modules/adal-node/lib/fs doesn't exist (module as directory) 
    resolve 'file' fs in /Users/luis.valencia/Documents/GraphSamples/Sample1/node_modules/adal-node/lib 
     resolve file 

und der Code I ist dies installiert

Ich habe sogar die JS-Zeile required kommentiert, aber es sieht aus wie Adal JS-Bibliothek selbst verwendet FS, die nicht korrekt installiert zu sein scheint?

import { 
    BaseClientSideWebPart, 
    IPropertyPaneSettings, 
    IWebPartContext, 
    PropertyPaneTextField 
} from '@microsoft/sp-client-preview'; 

import styles from './Hellomsgraph.module.scss'; 
import * as strings from 'hellomsgraphStrings'; 
import { IHellomsgraphWebPartProps } from './IHellomsgraphWebPartProps'; 
import * as MicrosoftGraph from "microsoft-graph" 

const accessToken:string = ""; 
//var fs = require('fs'); 
var adal = require('adal-node'); 
var AuthenticationContext = adal.AuthenticationContext; 


export default class HellomsgraphWebPart extends BaseClientSideWebPart<IHellomsgraphWebPartProps> { 

    public constructor(context: IWebPartContext) { 
    super(context); 
    } 

    public render(): void { 
    this.domElement.innerHTML = ` 
     <div class="${styles.hellomsgraph}"> 
     <div class="${styles.container}"> 
      <div class="ms-Grid-row ms-bgColor-themeDark ms-fontColor-white ${styles.row}"> 
      <div class="ms-Grid-col ms-u-lg10 ms-u-xl8 ms-u-xlPush2 ms-u-lgPush1"> 
       <span class="ms-font-xl ms-fontColor-white">Welcome to SharePoint!</span> 
       <p class="ms-font-l ms-fontColor-white">Customize SharePoint experiences using Web Parts.</p> 
       <p class="ms-font-l ms-fontColor-white">${this.properties.description}</p> 
       <a href="https://github.com/SharePoint/sp-dev-docs/wiki" class="ms-Button ${styles.button}"> 
       <span class="ms-Button-label">Learn more</span> 
       </a> 
      </div> 
      </div> 
     </div> 
     </div>`; 
    } 

    protected get propertyPaneSettings(): IPropertyPaneSettings { 
    return { 
     pages: [ 
     { 
      header: { 
      description: strings.PropertyPaneDescription 
      }, 
      groups: [ 
      { 
       groupName: strings.BasicGroupName, 
       groupFields: [ 
       PropertyPaneTextField('description', { 
        label: strings.DescriptionFieldLabel 
       }) 
       ] 
      } 
      ] 
     } 
     ] 
    }; 
    } 
} 

Answer 1

fügen Sie diese webpack.config.js

target: 'node', 

Siehe here und here