Sp-dev-docs: Getting Started Instructions default to blank screen

[Dodge1350]

I have attempted the "Getting started" configuration guides for setting up the development environment and assembling the "Getting started" Hello World web part. The default installation instructions failed on all three environments with exactly the same errors identified in developer tools of IE 11. The failure results in what appears to be an operational web part, but showing a blank screen in IE 11.

Error Data:
SCRIPT1053: Const must be initialized
workbenchInit.js (10,21)
SCRIPT5007: Object expected
sp-loader-assembly_default.js (5854, 13)

Reproduction Steps:
Using: Windows 10 Version 1803

From command prompt, run the following steps:

DEVELOPMENT ENVIRONMENT SETUP INSTRUCTIONS

Reference: https://docs.microsoft.com/en-us/sharepoint/dev/spfx/set-up-your-development-environment

Install NodeJS. (https://nodejs.org/en/)

node -v to check version

Install Visual Studio Code Editor (https://code.visualstudio.com)

Select all check boxes for options:
Create desktop icon
Add "Open with Code" action to Windows Explorer file context menu
Add "Open with Code" action to Windows Explorer directory context menu
Register Code as an editor for supported file types
Add to PATH (available after restart)

Restart Computer

npm install -g yo gulp

npm install -g @microsoft/generator-sharepoint

END OF CONFIGURATION

SOLUTION SETUP INSTRUCTIONS

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

cd "C:\Users\<username>\SPFx-Projects\

md helloworld-webpart

cd helloworld-webpart

yo @microsoft/sharepoint

When prompted:
Accept the default helloworld-webpart as your solution name, and then select Enter.
Select SharePoint Online only (latest), and select Enter.
Select Use the current folder for where to place the files.
Select N to require the extension to be installed on each site explicitly when it's being used.
Select WebPart as the client-side component type to be created.

The next set of prompts ask for specific information about your web part:
Accept the default HelloWorld as your web part name, and then select Enter.
Accept the default HelloWorld description as your web part description, and then select Enter.
Accept the default No javascript web framework as the framework you would like to use, and then select Enter.

cd "C:\Users\<username>\SPFx-Projects\helloworld-webpart"

gulp trust-dev-cert

gulp serve

END OF SOLUTION SETUP

Solution successfully loads and opens browser window, where blank page is shown with developer tools console errors (listed above). This has occurred in three different generic pc's the exact same way, so it is reproduceable. Remember, these are supposed to be getting started instructions, and clearly that is not the case if this is the result. Some of the comments I have read addressing issues already reported indicate that significant advanced knowledge of the frameworks and these compiler tools is needed in order to get this running. I would assume most folks coming from the old development environment would have very limited if any knowledge of these frameworks, and therefore any get started documentation should have that in mind. Am I missing something?

---

Document Details

⚠ Do not edit this section. It is required for docs.microsoft.com ➟ GitHub issue linking.

• ID: 6c25a90e-829c-b436-d8ab-f9c010588ee1
• Version Independent ID: 768fa9a1-2375-fb5a-be58-cb66320cc789
• Content: Build your first SharePoint client-side web part (Hello World part 1)
• Content Source: docs/spfx/web-parts/get-started/build-a-hello-world-web-part.md
• Product: sharepoint
• GitHub Login: @spdevdocs
• Microsoft Alias: spdevdocs

[KingKangMSFT]

I have tried this, there are no error when the blank page shown. And if we try to reload this page, the web part will show

[Dodge1350]

I just attempted the same script I provided here and I get the same errors on a PC outside of our network in an attempt to identify a possible firewall/port issue. Same result. Every attempt yields the same result. Don't know how you got this to work, but I would be interested to know if you deviated from the notes I provided on the script to process.

[Dodge1350]

Update: Checked the installations in Edge and the page is showing as intended. So, this appears to be an Internet Explorer 11 issue. Any ideas on how that can be fixed? If it cannot be shown in IE 11 for some reason, wouldn't it make sense to denote that in the getting started details?

[PhilFancy]

Update: Checked the installations in Edge and the page is showing as intended. So, this appears to be an Internet Explorer 11 issue. Any ideas on how that can be fixed? If it cannot be shown in IE 11 for some reason, wouldn't it make sense to denote that in the getting started details?

I am facing the exact same issue. IE11 on Windows 10.
When opening the page in Edge or Chrome workbench loads without any issue. Seems to be IE related.

[jakemannion]

IE11 doesn't handle React JS content (like the web part in this tutorial) very well, from what I've gathered. I don't know and of the details, I just know that it's an issue. The other modern browsers handle it more gracefully. Developers can include an extra package called "polyfill" to help ensure their React solutions work smoothly on IE11.

[Szab]

The same problem occurs to me - the workbench doesn't load at all on IE11, yet it works correctly on Chrome. I use @microsoft/[email protected] and IE 11.2485.13493.0 (update 11.0.85, KB4457426). There are two errors in the console:

SCRIPT1053: Const must be initialized
workbenchInit.js (10,21)

SCRIPT5007: Object expected
sp-loader-assembly_default.js (5854,13)

[wpo365]

Same problem as @Szab with me: Same config / same errors.

[adilkhali]

Same here as @Szab and @wpo365 , any solutions ?

[deepikatyagi]

this does not work on IE at all. Always shows blank screen. Change the default browser to firefox/chrome and run the gulp serve again. The workbench loads as expected.
A question though, how to break the gulp serve command. it is always running in the cmd console even when we close the browser window where workbench is loaded.

[jeffliang0318]

      this does not work on IE at all. Always shows blank screen. Change the default browser to firefox/chrome and run the gulp serve again. The workbench loads as expected.

A question though, how to break the gulp serve command. it is always running in the cmd console even when we close the browser window where workbench is loaded.
Sam issue, work fin on edge but not IE. And out company default browser is IE.... Everything Microsoft....
@deepikatyagi have you tried Ctrl + c ?

[jeffliang0318]

So we can't use react framework on IE? Our company is using IE as default browser...

[Szab]

So we can't use react framework on IE? Our company is using IE as default browser...

Only a workbench, probably. Webparts and extensions created with SPFx should work regardless of that (if proper polyfills are used).

[jeffliang0318]

I tried to create a test sharepoint site and tested on "https://your-sharepoint-tenant.sharepoint.com/_layouts/15/workbench.aspx".
By doing this, IE is good for gulp serve

[andrewconnell]

Are you still having issues with this? Modern pages, such as the workbench, should work in IE1 when the document mode is set to IE11 (ref: https://support.office.com/en-us/article/Which-Browsers-Work-With-Office-Online-AD1303E0-A318-47AA-B409-D3A5EB44E452).

[msft-github-bot]

This issue has been automatically marked as stale because it has marked as requiring author feedback but has not had any activity for 7 days. It will be closed if no further activity occurs within next 7 days of this comment. Thank you for your contributions to SharePoint Developer activities.

[deepikatyagi]

The issue is resolved now. :)

On Tue, Jul 16, 2019 at 8:14 PM Andrew Connell [e-mail]
wrote:

Are you still having issues with this? Modern pages, such as the
workbench, should work in IE1 when the document mode is set to IE11 (ref:
https://support.office.com/en-us/article/Which-Browsers-Work-With-Office-Online-AD1303E0-A318-47AA-B409-D3A5EB44E452
).

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/SharePoint/sp-dev-docs/issues/2668?email_source=notifications&email_token=AGT4Y4DBPMZAY7S2CR4YOFDP7XNFBA5CNFSM4FYKMDKKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD2BCYDY#issuecomment-511847439,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AGT4Y4GAAKTEXQ2ZLCTRKW3P7XNFBANCNFSM4FYKMDKA
.

[euvin3582]

Still need a fix for this.

[simonssspirit]

I also have the same issue, why it is marked as closed and there is no resolution on how it has to be fixed?

[andrewconnell]

@simonssspirit because the issue submitted by the OP was resolved. Closed issues aren't monitored so if you are having a problem, please open a new issue and provide as much context as possible.