Error @microsoft/sharepoint

[Joanna2211]

What type of issue is this?

Question

What SharePoint development model, framework, SDK or API is this about?

💥 SharePoint Framework

Target SharePoint environment

SharePoint Online

What browser(s) / client(s) have you tested

• 💥 Internet Explorer
• 💥 Microsoft Edge
• 💥 Google Chrome
• 💥 FireFox
• 💥 Safari
• mobile (iOS/iPadOS)
• mobile (Android)
• not applicable
• other (enter in the "Additional environment details" area below)

Additional environment details

+-- @angular/[email protected]
+-- @microsoft/[email protected]
+-- @microsoft/[email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]
node --version v14.15.0
npm -v 6.14.8

Issue description

Cannot create a web part project by executing yo @microsoft/sharepoint

PS C:\Windows\system32> cd "C:\Users(username)\CustomWebPart"
PS C:\Users(username)\CustomWebPart> yo @microsoft/sharepoint

See https://aka.ms/spfx-yeoman-info for more information on how to use this generator.
Let's create a new SharePoint solution.
? What is your solution name? OneWebPart
? Which type of client-side component to create? WebPart
Add new Web part to solution one-web-part.
? What is your Web part name? HelloWorld
? Which template would you like to use? No framework

Error @microsoft/sharepoint

Trying to copy from a source that does not exist: C:\Users(username)\AppData\Roaming\npm\node_modules@microsoft\generator-sharepoint\lib\generators\solution\templates\spo\tsconfig.json

I have accessed C:\Users(username)\AppData\Roaming\npm\node_modules@microsoft\generator-sharepoint\lib\generators\solution\templates\spo\ and able to find tsconfig.json files

[ghost]

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

[AJIXuMuK]

Hi @Joanna2211 - thank you for reporting this issue.
Usually these type of problems is related to some misconfiguration on the machine.

I would recommend to reinstall the generator.
Also double-check it is installed for the same user that is going to create the project (maybe some access policies on the machine).
If you're using nvm or nvs - make sure the generator is installed for the current version of Node you're using to create the project.

Let me know on the results.

Thanks!

[Joanna2211]

Hi @AJIXuMuK, I tried to reinstall the generator but still no luck. I am using nvm and changed to Nodejs 14.15.0 before reinstall
Here is my procedure:
C:\Windows\system32>nvm list

• 14.15.0 (Currently using 64-bit executable)
  10.24.1

C:\Windows\system32>npm list --depth=0 -g
C:\Users(username)\AppData\Roaming\npm
+-- @angular/[email protected]
+-- @microsoft/[email protected]
+-- @microsoft/[email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]

C:\Windows\system32>npm uninstall @microsoft/generator-sharepoint -g
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated [email protected]: "Please update to latest v2.3 or v2.2"
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.3.2 (node_modules@microsoft\generator-sharepoint\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules@microsoft\generator-sharepoint\node_modules\watchpack-chokidar2\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.1.2 (node_modules@microsoft\generator-sharepoint\node_modules@rushstack\typings-generator\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules@microsoft\generator-sharepoint\node_modules\webpack-dev-server\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

removed 1433 packages in 9.407s

C:\Windows\system32>npm list --depth=0 -g
C:\Users(username)\AppData\Roaming\npm
+-- @angular/[email protected]
+-- @microsoft/[email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]

C:\Windows\system32>node --version
v14.15.0

C:\Windows\system32>npm install @microsoft/generator-sharepoint --global
npm WARN deprecated [email protected]: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: The functionality that this package provided is now in @npmcli/arborist
npm WARN deprecated [email protected]: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
npm WARN deprecated @opentelemetry/[email protected]: Package renamed to @opentelemetry/api, see https://github.com/open-telemetry/opentelemetry-js
npm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated [email protected]: "Please update to latest v2.3 or v2.2"
npm WARN deprecated [email protected]: request has been deprecated, see request/request#3142
npm WARN deprecated [email protected]: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.
npm WARN deprecated [email protected]: this library is no longer supported

[email protected] install C:\Users(username)\AppData\Roaming\npm\node_modules@microsoft\generator-sharepoint\node_modules\node-sass
node scripts/install.js

Cached binary found at C:\Users(username)\AppData\Roaming\npm-cache\node-sass\4.14.1\win32-x64-83_binding.node

[email protected] postinstall C:\Users(username)\AppData\Roaming\npm\node_modules@microsoft\generator-sharepoint\node_modules\node-sass
node scripts/build.js

Binary found at C:\Users(username)\AppData\Roaming\npm\node_modules@microsoft\generator-sharepoint\node_modules\node-sass\vendor\win32-x64-83\binding.node
Testing binary
Binary is fine
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.3.2 (node_modules@microsoft\generator-sharepoint\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules@microsoft\generator-sharepoint\node_modules\watchpack-chokidar2\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.1.2 (node_modules@microsoft\generator-sharepoint\node_modules@rushstack\typings-generator\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules@microsoft\generator-sharepoint\node_modules\webpack-dev-server\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

• @microsoft/[email protected]
  added 1433 packages from 682 contributors in 48.749s

C:\Windows\system32>npm list --depth=0 -g
C:\Users(username)\AppData\Roaming\npm
+-- @angular/[email protected]
+-- @microsoft/[email protected]
+-- @microsoft/[email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]

C:\Windows\system32>cd C:\Users(username)\CustomWebPart

C:\Users(username)\CustomWebPart>yo @microsoft/sharepoint

 _-----_     ╭──────────────────────────╮
|       |    │      Welcome to the      │
|--(o)--|    │  SharePoint Online SPFx  │

---------´ │ Yeoman [email protected] │ ( _´U_ ) ╰──────────────────────────╯
/A\ /
| ~ |
'..'_
´ |° ´ Y

See https://aka.ms/spfx-yeoman-info for more information on how to use this generator.
Let's create a new SharePoint solution.
? What is your solution name? FirstWebPart
? Which type of client-side component to create? WebPart
Add new Web part to solution first-web-part.
? What is your Web part name? HelloWorld
? Which template would you like to use? No framework

Error @microsoft/sharepoint

Trying to copy from a source that does not exist: C:\Users(username)\AppData\Roaming\npm\node_modules@microsoft\generator-sharepoint\lib\generators\solution\templates\spo\tsconfig.json

C:\Users(username)\CustomWebPart>

[AJIXuMuK]

@Joanna2211 - thank you for the details.
It seems a bit weird to me.
First of all, nvm stores modules in AppData\Roaming\nvm not AppData\Roaming\npm.
Second, node_modules@microsoft is not a correct path for sure. There should be \ in between.
I tested your scenario (same node version, nvm, generator, etc.) and found no issues.

Is there anything additional\specific about your environment?
Do you have nodejs installed on the machine itself, without nvm? What version?
Are you using Docker containers?

[Joanna2211]

@AJIXuMuK , thanks for your help.
For #1, I got both AppData\Roaming\nvm and AppData\Roaming\npm, so I think the nvm stores on correct location.
For #2, You are right, the path is incorrect, but I don't know why it gets the incorrect path.

At the beginning, I followed https://docs.microsoft.com/en-us/sharepoint/dev/spfx/set-up-your-development-environment to setup my environment. And I faced this error, so i installed nvm to change the nodejs version in order to use lower version of shrepoint generator.

I have installed nodejs 14.15.0 on the machine. I haven't used Docker.

[AJIXuMuK]

Thank @Joanna2211 for the reply.
Let's try and start from scratch as the behavior is weird.
BTW, I assume you're on either Windows 10 or 11, correct?

So let's try to do the next:

1. remove nodejs (using control panel)
2. remove nvm (How to uninstall nvm? nvm-sh/nvm#298)
3. I would recommend use nvs instead of nvm as it doesn't "pollute" your main machine and main npm folder if you have one.
4. use nvs to install node v14 and switch to it
5. Then try to go throught the tutorial again, or just:

npm i -g gulp-cli yo
npm i -g @microsoft/generator-sharepoint

And see how it works.

If the folder is still weird - try install any other module that has namespace (for example, @pnp/spfx-controls-react) and check if it produces the same weird path.
If yes - it's some strange configuration of machine + nodejs/npm.

Maybe, as an option try to use yarn instead of npm: https://yarnpkg.com/

[Joanna2211]

@AJIXuMuK , thanks for your reply. I am using Windows 10. May I know where is the difference between nvs and nvm? Actually, I have installed other nodejs version (10.24.1) using nvm and installed @microsoft/[email protected], it is working normally. If i changed to use nvs, will it affect my current working environment?

[AJIXuMuK]

@Joanna2211 nvs and nvm are 2 different node version managers. I don't know all the specifics but from my experience nvm may use global node_modules folder (under npm subfolder) to store modules.
That may sometimes lead to unpredictable behavior.
nvs always uses isolated node_modules for each installed version.

For your question - if you delete nvm, it of course will affect you current working environment.
But you can have both nvm and nvs installed on the same machine.

Actually, I have installed other nodejs version (10.24.1) using nvm and installed @microsoft/[email protected], it is working normally. If i changed to use nvs, will it affect my current working environment?

Could you search for this version's folder and check how the paths are created in there? Is it still node_modules@microsoft or node_modules\@microsoft?

[ghost]

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 the next 7 days of this comment. Please see our wiki for more information: Issue List Labels: Needs Author Feedback & Issue List: No response from the original issue author

[ghost]

Closing issue due to no response from the original author. Please refer to our wiki for more details, including how to remediate this action if you feel this was done prematurely or in error: No response from the original issue author