"ग्रास सेवा" लौट रहा है workbench.html कि मैं नहीं कर सकते हैं, वेब पार्ट जोड़ने

Question 1

मैं एक विकसित किया SPFx वेब पार्ट के साथ इस विवरण:-

यो-आर.सी.json परियोजना के लिए है:-

{
  "@microsoft/generator-sharepoint": {
    "isCreatingSolution": true,
    "environment": "spo",
    "version": "1.12.1",
    "libraryName": "spfx-my-modal-popup",
    "libraryId": "616c9b54-d123-42d8-9942-9abb0fe4f46c",
    "packageManager": "npm",
    "isDomainIsolated": false,
    "componentType": "webpart"
  }
}

अब मैं स्थापित nvm सक्षम होना करने के लिए चलाने के लिए कई नोड संस्करणों, यहाँ मैं क्या किया है अब तक:-

1 - मैं स्थापित नोड संस्करण 10.24.1 , तो मैं इसे का उपयोग करें का पालन के रूप में :-

nvm use 10.24.1

2 - मैं चलाने के लिए :-

gulp serve

के https://localhost:4321/temp/workbench.html खोला, लेकिन मैं कोशिश की जब जोड़ने के लिए, वेब पार्ट पर क्लिक करके + आइकन मैं इस त्रुटि के अंदर F12 डेवलपर उपकरण:-

यहाँ है पूर्ण त्रुटि:-

[1636842661379][PropertyPaneLoader] [SPLoaderError.loadComponentError]:

***Failed to load component "f9e737b7-f0df-4597-ba8c-3060f82380db" (SPPropertyPane). Original error: ***Failed to load URL 'https://localhost:4321/node_modules/@microsoft/sp-property-pane/dist/dist/sp-property-pane_en-us.js' for resource 'sp-property-pane' in component 'f9e737b7-f0df-4597-ba8c-3060f82380db' (SPPropertyPane). The file was not found in the server. Make sure that you are running 'gulp serve'.



***INNERERROR:

***Failed to load URL 'https://localhost:4321/node_modules/@microsoft/sp-property-pane/dist/dist/sp-property-pane_en-us.js' for resource 'sp-property-pane' in component 'f9e737b7-f0df-4597-ba8c-3060f82380db' (SPPropertyPane). The file was not found in the server. Make sure that you are running 'gulp serve'.

***CALLSTACK:

SPError@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:24443:24
SPLoaderError@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:42161:28
ff4n/ErrorBuilder</ErrorBuilder.buildErrorWithVerboseLog@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46155:21
ff4n/ErrorBuilder</ErrorBuilder.buildLoadComponentError@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46024:21
_loadComponentImpl/<@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45362:75
promise callback*_loadComponentImpl@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45361:8
_loadComponentRetryStrategy@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45299:12
_loadComponentRetryStrategy/<@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309:20
promise callback*_loadComponentRetryStrategy@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304:10
_loadComponentRetryStrategy/<@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309:20
promise callback*_loadComponentRetryStrategy@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304:10
loadComponent@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45281:55
++S4/SPRequireJsComponentLoader</SPRequireJsComponentLoader.prototype._loadComponentWithExecutor@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41771:85
td2X/LoadComponentExecutor</LoadComponentExecutor.prototype.loadComponent@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46896:21
++S4/SPRequireJsComponentLoader</SPRequireJsComponentLoader.prototype.loadComponent@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41742:44
Uk6p/BaseComponentLoader</BaseComponentLoader.prototype.loadComponentById@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:44816:25
KZU3/SPComponentLoader</SPComponentLoader.loadComponentById@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43438:44
get@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:110639:99
set@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:16957:21
set@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:14989:13
CanvasToolboxHint/_this._handleClick@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/chunk.sp-canvas-edit_7833b0118fe685da1388.js:3982:17
callCallback@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75432:14
invokeGuardedCallbackDev@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75482:16
invokeGuardedCallback@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75539:31
invokeGuardedCallbackAndCatchFirstError@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75553:25
executeDispatch@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75844:42
executeDispatchesInOrder@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75866:20
executeDispatchesAndRelease@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75963:29
executeDispatchesAndReleaseTopLevel@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75971:10
forEachAccumulated@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75945:8
runEventsInBatch@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76099:21
runExtractedEventsInBatch@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76107:19
handleTopLevel@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80109:30
batchedUpdates$1@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95687:12
batchedUpdates@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:77434:12
dispatchEvent@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80188:19
interactiveUpdates$1/<@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95738:14
unstable_runWithPriority@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:97248:12
interactiveUpdates$1@https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95737:22
sp-webpart-workbench-assembly_default.js:26401:21
Uncaught (in promise) Error: ***Failed to load component "f9e737b7-f0df-4597-ba8c-3060f82380db" (SPPropertyPane). Original error: ***Failed to load URL 'https://localhost:4321/node_modules/@microsoft/sp-property-pane/dist/dist/sp-property-pane_en-us.js' for resource 'sp-property-pane' in component 'f9e737b7-f0df-4597-ba8c-3060f82380db' (SPPropertyPane). The file was not found in the server. Make sure that you are running 'gulp serve'.
    SPError https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:24443
    SPLoaderError https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:42161
    buildErrorWithVerboseLog https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46155
    buildLoadComponentError https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46024
    _loadComponentImpl https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45362
    promise callback*_loadComponentImpl https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45361
    _loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45299
    _loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309
    promise callback*_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304
    _loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309
    promise callback*_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304
    loadComponent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45281
    loadComponent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46458
    _loadComponentImpl https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43631
    promise callback*PypK/SystemJsFallbackLoader</SystemJsFallbackLoader.prototype._loadComponentImpl https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43621
    loadComponent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46896
    loadComponent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43617
    _loadComponentWithExecutor https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41781
    promise callback*++S4/SPRequireJsComponentLoader</SPRequireJsComponentLoader.prototype._loadComponentWithExecutor https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41777
    loadComponent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46896
    loadComponent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41742
    loadComponentById https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:44816
    loadComponentById https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43438
    get https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:110639
    set https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:16957
    set https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:14989
    _handleClick https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/chunk.sp-canvas-edit_7833b0118fe685da1388.js:3982
    callCallback https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75432
    invokeGuardedCallbackDev https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75482
    invokeGuardedCallback https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75539
    invokeGuardedCallbackAndCatchFirstError https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75553
    executeDispatch https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75844
    executeDispatchesInOrder https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75866
    executeDispatchesAndRelease https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75963
    executeDispatchesAndReleaseTopLevel https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75971
    forEachAccumulated https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75945
    runEventsInBatch https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76099
    runExtractedEventsInBatch https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76107
    handleTopLevel https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80109
    batchedUpdates$1 https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95687
    batchedUpdates https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:77434
    dispatchEvent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80188
    1 https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95738
    unstable_runWithPriority https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:97248
    interactiveUpdates$1 https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95737
    interactiveUpdates https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:77453
    dispatchInteractiveEvent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80165
sp-webpart-workbench-assembly_default.js:24430:28
Uncaught (in promise) Error: ***Failed to load component "f9e737b7-f0df-4597-ba8c-3060f82380db" (SPPropertyPane). Original error: ***Failed to load URL 'https://localhost:4321/node_modules/@microsoft/sp-property-pane/dist/dist/sp-property-pane_en-us.js' for resource 'sp-property-pane' in component 'f9e737b7-f0df-4597-ba8c-3060f82380db' (SPPropertyPane). The file was not found in the server. Make sure that you are running 'gulp serve'.
    SPError https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:24443
    SPLoaderError https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:42161
    buildErrorWithVerboseLog https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46155
    buildLoadComponentError https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46024
    _loadComponentImpl https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45362
    promise callback*_loadComponentImpl https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45361
    _loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45299
    _loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309
    promise callback*_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304
    _loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309
    promise callback*_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304
    loadComponent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45281
    _loadComponentWithExecutor https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41771
    loadComponent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46896
    loadComponent https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41742
    loadComponentById https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:44816
    loadComponentById https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43438
    get https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:110639
    set https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:16957
    set https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:14989
    _handleClick https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/chunk.sp-canvas-edit_7833b0118fe685da1388.js:3982
    callCallback https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75432
    invokeGuardedCallbackDev https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75482
    invokeGuardedCallback https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75539
    invokeGuardedCallbackAndCatchFirstError https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75553
    executeDispatch https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75844
    executeDispatchesInOrder https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75866
    executeDispatchesAndRelease https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75963
    executeDispatchesAndReleaseTopLevel https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75971
    forEachAccumulated https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75945
    runEventsInBatch https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76099
    runExtractedEventsInBatch https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76107
    handleTopLevel https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80109
    batchedUpdates$1 https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95687
    batchedUpdates https://localhost:4321/temp/workbench-packages/@microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:77434
    dispatchEvent https://localhost:4321/temp/workbench-packages

यहाँ है मेरी MyModalPopupWebPart.ts:-

import * as React from 'react';
import * as ReactDom from 'react-dom';
import { Version } from '@microsoft/sp-core-library';
import {
  IPropertyPaneConfiguration,
  PropertyPaneTextField
} from '@microsoft/sp-property-pane';
import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base';

import * as strings from 'MyModalPopupWebPartStrings';
import MyModalPopup from './components/MyModalPopup';
import { IMyModalPopupProps } from './components/IMyModalPopupProps';

export interface IMyModalPopupWebPartProps {
  description: string;
  WhoWeAre: string;
  OurValue:string;
}

export default class MyModalPopupWebPart extends BaseClientSideWebPart<IMyModalPopupWebPartProps> {

  public render(): void {
    const element: React.ReactElement<IMyModalPopupProps> = React.createElement(
      MyModalPopup,
      {
        description: this.properties.description,
        WhoWeAre: this.properties.WhoWeAre,
        OurValue: this.properties.OurValue
      }
    );

    ReactDom.render(element, this.domElement);
  }

  protected onDispose(): void {
    ReactDom.unmountComponentAtNode(this.domElement);
  }

  protected get dataVersion(): Version {
    return Version.parse('1.0');
  }

  protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
    return {
      pages: [
        {
          header: {
            description: strings.PropertyPaneDescription
          },
          groups: [
            {
              groupName: strings.BasicGroupName,
              groupFields: [
                PropertyPaneTextField('WhoWeAre', {
                  label: "who We Are",
                  multiline: true
                }),
                PropertyPaneTextField('OurValue', {
                  label: "Our value",
                  multiline: true
                }), PropertyPaneTextField('description', {
                  label: "Description"
                }),
              ]
            }
          ]
        }
      ]
    };
  }
}

यहाँ है मेरी MYModal.tsx:-

import * as React from 'react';
import { useId, useBoolean } from '@fluentui/react-hooks';
import { sanitize } from 'dompurify';
import {
  getTheme,
  mergeStyleSets,
  FontWeights,
  Modal,
  IIconProps,
  IStackProps,
} from '@fluentui/react';
import { IconButton, IButtonStyles } from '@fluentui/react/lib/Button';
export const MYModal = (myprops) => {
  const [isModalOpen, { setTrue: showModal, setFalse: hideModal }] = useBoolean(false);
  const [isPopup, setisPopup] = React.useState(true);
  const titleId = useId('title');
  React.useEffect(() => {
      showModal();
  }, [isPopup]);
  function ExitHandler() {
    hideModal();
    setisPopup(current => !current)
    myprops.handler();
  }

  return (
    <div>
      <Modal
        titleAriaId={titleId}
        isOpen={isModalOpen}
        onDismiss={ExitHandler}
        isBlocking={true}
        containerClassName={contentStyles.container}
      >
        <div className={contentStyles.header}>
          <span id={titleId}>Modal Popup</span>
          <IconButton
            styles={iconButtonStyles}
            iconProps={cancelIcon}
            ariaLabel="Close popup modal"
            onClick={ExitHandler}
          />
        </div>
        <div  className={contentStyles.body}>
        <div dangerouslySetInnerHTML={{ __html: sanitize(myprops.WhoWeAre) }} />

        </div>
      </Modal>

    </div>

  );
};

यहाँ है मेरी MyModalPopup.tsx:-

import * as React from 'react';
import { IMyModalPopupProps } from './IMyModalPopupProps';
import { DefaultButton } from '@fluentui/react/lib/Button';
import { MYModal } from './MYModal';
import { MYModal2 } from './MYModal2';

interface IPopupState {
  showModal: string;
}

export default class MyModalPopup extends React.Component<IMyModalPopupProps, IPopupState> {
  constructor(props: IMyModalPopupProps, state: IPopupState) {
    super(props);
    this.state = {
      showModal: ''
    };
    this.handler = this.handler.bind(this);
    this.Buttonclick = this.Buttonclick.bind(this);
  }
  handler() {
    this.setState({
      showModal: ''
    })
  }
  private Buttonclick(e, whichModal) {
    e.preventDefault();

    this.setState({ showModal: whichModal });
  }
  public render(): React.ReactElement<IMyModalPopupProps> {

    const { showModal } = this.state;

    return (
      <div>

        <DefaultButton onClick={(e) => this.Buttonclick(e, 'our-value')} text="Our Value" />
        { showModal === 'our-value' && <MYModal2 OurValue={this.props.OurValue} myprops={this.state} handler={this.handler} />}

        <DefaultButton onClick={(e) => this.Buttonclick(e, 'who-we-are')} text="Who We Are" />
        { showModal === 'who-we-are' && <MYModal WhoWeAre={this.props.WhoWeAre} myprops={this.state} handler={this.handler} />}
      </div>
    );
  }
}

Question 2

ऐसा लगता है कि वहाँ है "जिला" URL में आप है. आप की जरूरत है एक को हटाने के लिए किसी भी तरह:

.../sp-property-pane/dist/dist/sp-property-pane_en/...

ऐसा लगता है कुछ होने के लिए परियोजना misconfiguration मुद्दा है । मैं आप की सिफारिश करने के लिए एक नई परियोजना बनाने के बाद, कदम से "शुरू हो रही" आधिकारिक यहाँ ट्यूटोरियल:

https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/build-a-hello-world-web-part

सुनिश्चित करें कि आप की सिफारिश की संस्करण के नोड स्थापित (वहाँ है "सेट अप अपने विकास के वातावरण" अध्याय, कृपया सुनिश्चित करें कि आप का पालन क्या वहाँ लिखा है).

Nikolay · Answer 1 · 2021-11-14T14:15:20

1

ऐसा लगता है कि वहाँ है "जिला" URL में आप है. आप की जरूरत है एक को हटाने के लिए किसी भी तरह:

.../sp-property-pane/dist/dist/sp-property-pane_en/...

ऐसा लगता है कुछ होने के लिए परियोजना misconfiguration मुद्दा है । मैं आप की सिफारिश करने के लिए एक नई परियोजना बनाने के बाद, कदम से "शुरू हो रही" आधिकारिक यहाँ ट्यूटोरियल:

https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/build-a-hello-world-web-part

सुनिश्चित करें कि आप की सिफारिश की संस्करण के नोड स्थापित (वहाँ है "सेट अप अपने विकास के वातावरण" अध्याय, कृपया सुनिश्चित करें कि आप का पालन क्या वहाँ लिखा है).

Nikolay

2021-11-14 14:15:20

जब मैं करने की कोशिश की एक नया बनाने के लिए हैलो दुनिया वेब, भाग,, और मैं चलाने के लिए gulp serve मैं इस त्रुटि मिलती है Cannot GET /temp/workbench.html .. यहाँ है स्थापित करने के लिए .yo-rc

{ "@microsoft/generator-sharepoint": { "plusBeta": false, "isCreatingSolution": true, "environment": "spo", "version": "1.13.0", "libraryName": "f", "libraryId": "ef98ebd8-128a-4417-a2b8-d57a9f3e3df4", "packageManager": "npm", "isDomainIsolated": false, "componentType": "webpart" } }

किसी भी विचार है?

john Gu

कृपया सुनिश्चित करें कि आप का उपयोग कर रहे हैं समर्थित नोड संस्करण और ट्यूटोरियल का पालन करें. यह काम करता है. मैं आप की सिफारिश करेंगे हटा दें .यो-rc फ़ाइल और खरोंच से शुरू करते हैं.

Nikolay

नोड संस्करण है C:\f>node -v v12.22.7.. और SPFx संस्करण है 1.13.0 तो दोनों अच्छी तरह से एक साथ काम करना चाहिए

john Gu

मैं नहीं किया है के साथ की जाँच की 1.13.0 (यह जारी किया गया था अभी हाल ही में). के रूप में दूर के रूप में याद है कि वे कहा है कि वे deprecate स्थानीय कार्यक्षेत्र, केवल रिमोट का समर्थन किया जाएगा के साथ शुरू 1.13. हो सकता है यह हो सकता है किसी भी तरह से संबंधित है?

Nikolay

हाँ, मैं बदल गया "initialPage": "https://myrealserver.sharepoint.com/_layouts/workbench.aspx" और नमस्ते दुनिया है अच्छी तरह से काम कर

john Gu

तो वापस करने के लिए मेरा सवाल है ... क्यों मेरे वेब पार्ट है, जो SPFX version "version": "1.12.1", & node version 10.24.1` काम नहीं कर रहा है, जब मैं चला gulp serve

john Gu

आप साझा कर सकते हैं पूर्ण कोड और config (के रूप में एक github रेपो उदाहरण के लिए)? अन्यथा, यह मुश्किल है बताने के लिए, वास्तव में )

Nikolay

ठीक है, मैं प्रदान की है, पूरा कोड

john Gu

"ग्रास सेवा" लौट रहा है workbench.html कि मैं नहीं कर सकते हैं, वेब पार्ट जोड़ने

सवाल

सबसे अच्छा जवाब

अन्य भाषाओं में

यह पृष्ठ अन्य भाषाओं में है

इस श्रेणी में लोकप्रिय

लोकप्रिय सवाल इस श्रेणी में