pnpm - windows

[joelfmrodrigues]

Category

• Question
• Typo
• Bug
• Additional article idea

Expected or Desired Behavior

Scaffold a new SPFx project and use pnpm as the package manager (one of the options provided)

Observed Behavior

After creating a new project, I get build errors as the build task is unable to find tslint and typescript.
I also have those modules installed globally for other tools, but not sure if this is related to the problem.

Created a blog post with more detail and a workaround by specifying the packages as dependencies.

Steps to Reproduce

Create a new project and specify pnpm as the package manager (tested with SPFx 1.6.0)
run 'gulp build'

[jxnx888]

Hi @joelfmrodrigues The GIF below is the test from my side. I created project by using yo @microsoft/sharepoint –package-manager pnpm, and run the gulp build, I cannot reproduce your issue. Could you please provide more details? Such as screenshots of error, sample code...

[joelfmrodrigues]

Hi @jxnx888

I will run it again when I have the chance and post errors here. There is no custom code involved, only the files created from yeoman.
Do you have TypeScript and TSlint installed globally? Not sure if this is related, but I have both those modules also installed globally.

[joelfmrodrigues]

Hi @jxnx888

Are you using windows? Your building times are very small! Either you are using Mac or you have a really nice machine :)

I have just noticed from your gif that you missed a '-' on the initial command before package-manager :)
Please run:
yo @microsoft/sharepoint --package-manager pnpm

After you run the command, you should be able to see that pnpm is being used as per the image below
"The pnpm package manager will be used."

[joelfmrodrigues]

And this is the error. If I resolve this error by adding the package to package.json as a dependency, then I see the same error for typescript. And if I add typescript to package.json, everything works

I have also just tried this after removing the global packages and I can confirm that this is not the reason as the errors still happen after the global packages were uninstalled.

[jxnx888]

@joelfmrodrigues I do reproduce your issue.

Also, I think I resolved this issue, you may install tslint locally by using
npm install -g tslint or npm install tslint.
But I still recommend you download typescript-formatter too by using
npm install -g typescript-formatter.

[joelfmrodrigues]

Hi @jxnx888

Thanks for confirming :)
Yes, the issue is resolved if we install the modules as a dependency, as per my blog post linked above.
This is why I have raised it as an issue as I assume the extra step should not be something that we had to do.

[VesaJuvonen]

thx @joelfmrodrigues for the reference. We'll have a look at fixing this directly in engineering.

[deanbot]

should the --package-manager "pnpm" param add the necessary packages to the project dev dependencies?

For 1.9.1 these appear to be:

{
    "tslint-microsoft-contrib": "~5.2.1",
    "tslint": "~5.9.1",
    "typescript": "~2.9.2",
}

Or

{
    "@microsoft/rush-stack-compiler-3.3": "0.2.30",
    "tslint-microsoft-contrib": "~5.2.1",
    "tslint": "~5.12.1",
    "typescript": "~3.3.3",
}