I have used in this example Patrick Rodgers’ Yeoman sample project (https://www.npmjs.com/package/generator-sp-pnp-js-sample).
Before you will do anyting everything works fine and if you execute gulp build you will get successful build.
Before we can update to new version of the sp-pnp-js package, we need to check how it’s installed to the project. This can be done by checking the project.json file. It has two sections for external packages (dependencies and devDependencies).
We will execute
npm install sp-pnp-js@latest --save
to update sp-pnp-js to latest version. Note that you need to use –save parameter instead of –save-dev, because sp-pnp-js is in dependencies section instead of devDepencencies.
You can see that we have now the 1.0.5 version which we were looking for. Now if we will try to build our project, we notice that it will fail. At first everything seems to go fine.
but then we can see only red error lines and lots of those.
Now it’s time to read the manual or something like that. In our case explanation comes from GitHub commit comments. “Updates to TypeScript 2.0”. Ok. What this means? What version we have? It’s easy to find out. You can see it right after gulp build has started. It says that our version is 1.8.10.
npm install typescript@latest --save-dev
Note that now you need to use –save-dev, because typescript is in devDependencies section.
Now everything should work as we have updated TypeScript to required version.
Wait!! Why we get all those errors even though we have correct TypeScript version?
Removing extra typings
It seems that we have duplicate type definitions for all those typescript files. Previously sp-pnp-js required several external typings before it worked. Now those require typings have been added inside the package.
We need to remove external typings. Extra typings can be found from project\typings\ folder.
Execute following commands
typings uninstall whatwg-fetch --global typings uninstall es6-promise --global
Now you can execute
Everything works now.