New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SPFx Yeoman template broken by TypeScript 2.1 definition in @types/lodash #394

Closed
tarcisiocorte opened this Issue Jan 27, 2017 · 41 comments

Comments

Projects
None yet
@tarcisiocorte

tarcisiocorte commented Jan 27, 2017

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Category

  • Question
  • Typo
  • [ x] Bug
  • Enhancement / Suggestion
  • Additional article idea

Expected or Desired Behavior

I was just creating a Hellow world with SharePoint Framework

Step 1
yo @microsoft/sharepoint

step 2
lp trust-dev-cert

step 3
gulp serve
----the error showed up

Observed Behavior

Steps to Reproduce

I create a helloworld folder (Windows 10)
open cmdlet and typed
yo @microsoft/sharepoint
lp trust-dev-cert
gulp serve

Build target: DEBUG
[22:33:22] Using gulpfile c:\dev\helloworld_2\gulpfile.js
[22:33:22] Starting gulp
[22:33:22] Starting 'default'...
[22:33:22] Starting subtask 'pre-copy'...
[22:33:22] Finished subtask 'pre-copy' after 14 ms
[22:33:22] Starting subtask 'copyStaticAssets'...
[22:33:22] Starting subtask 'sass'...
[22:33:23] Finished subtask 'sass' after 720 ms
[22:33:23] Starting subtask 'tslint'...
[22:33:23] Starting subtask 'typescript'...
[22:33:23] [typescript] Using custom version: 2.0.10
[22:33:23] Finished subtask 'copyStaticAssets' after 810 ms
[22:33:26] Error - typescript - node_modules@types\lodash\index.d.ts(245,25): error TS2304: Cannot find name 'Partial'.
[22:33:26] Finished subtask 'tslint' after 3.15 s
[22:33:26] Error - 'typescript' sub task errored after 3.15 s
"TypeScript error(s) occurred."
[22:33:26] 'default' errored after 3.93 s
[22:33:26]
[22:33:27] ==================[ Finished ]==================
Error - typescript - node_modules@types\lodash\index.d.ts(245,25): error TS2304: Cannot find name 'Partial'.
Error - 'typescript' sub task errored after 3.15 s
"TypeScript error(s) occurred."
[22:33:27] Project helloworld-2 version: 0.0.1
[22:33:27] Build tools version: 1.1.0
[22:33:27] Node version: v6.4.0
[22:33:27] Total duration: 7.25 s
[22:33:27] Task errors: 2

@mrackley

This comment has been minimized.

Contributor

mrackley commented Jan 28, 2017

I'm receiving this same error. Works fine if I choose react for a framework. Is there any resolution yet?

@ozippy

This comment has been minimized.

ozippy commented Jan 29, 2017

Me too.

@terry8023

This comment has been minimized.

terry8023 commented Jan 29, 2017

received the same error...

@chakkaradeep

This comment has been minimized.

Collaborator

chakkaradeep commented Jan 29, 2017

I am able to repro this error in a fresh Windows machine.

@nickpape-msft @iclanton any ideas whats going on? I tried reinstalling lodash types but that doesn't seem to help.

@NPrice99

This comment has been minimized.

NPrice99 commented Jan 29, 2017

I am also getting this problem. I can also get it to work fine if I choose react for a framework.

Build target: DEBUG
[16:57:16] Using gulpfile ~\OneDrive\Documents\SPFx\Projects\helloworld-webpart-RC0\gulpfile.js
[16:57:16] Starting gulp
[16:57:16] Starting 'serve'...
[16:57:16] Starting subtask 'pre-copy'...
[16:57:16] Finished subtask 'pre-copy' after 21 ms
[16:57:16] Starting subtask 'copyStaticAssets'...
[16:57:16] Starting subtask 'sass'...
[16:57:18] Finished subtask 'sass' after 1.3 s
[16:57:18] Starting subtask 'tslint'...
[16:57:18] Starting subtask 'typescript'...
[16:57:18] [typescript] Using custom version: 2.0.10
[16:57:18] Finished subtask 'copyStaticAssets' after 1.4 s
[16:57:23] Error - typescript - node_modules@types\lodash\index.d.ts(245,25): error TS2304: Cannot find name 'Partial'.
[16:57:23] Finished subtask 'tslint' after 5.12 s
[16:57:23] Error - 'typescript' sub task errored after 5.13 s
"TypeScript error(s) occurred."
[16:57:23] 'serve' errored after 6.51 s
[16:57:23]
[16:57:23] ==================[ Finished ]==================
Error - typescript - node_modules@types\lodash\index.d.ts(245,25): error TS2304: Cannot find name 'Partial'.
Error - 'typescript' sub task errored after 5.13 s
"TypeScript error(s) occurred."
[16:57:24] Project helloworld-webpart-rc-0 version: 0.0.1
[16:57:24] Build tools version: 1.1.0
[16:57:24] Node version: v4.5.0
[16:57:24] Total duration: 12 s
[16:57:24] Task errors: 2

@pgonzal

This comment has been minimized.

pgonzal commented Jan 29, 2017

This is a regression introduced by DefinitelyTyped PR 13994.

As a workaround, you can run this command:

npm install @types/lodash@4.14.50

However, IMO it is inappropriate for the upstream PR to introduce a patch-level SemVer change that forces all consumers to immediately upgrade to the TypeScript 2.1 compiler. The PR even failed its Travis build for this reason, but was merged anyway.

@mhegazy @lukas-zech-software @andy-ms

@NPrice99

This comment has been minimized.

NPrice99 commented Jan 29, 2017

Does SPFX support TypeScript 2.1 ?

@pgonzal

This comment has been minimized.

pgonzal commented Jan 29, 2017

We just finished migrating to TypeScript 2.1 a week ago, but it hasn't been released yet. We're still testing. The 2.0 -> 2.1 migration was actually fairly involved compared to your normal intuition for a "minor" version increment. We'll explain this in more detail when the next release is published.

@NPrice99

This comment has been minimized.

NPrice99 commented Jan 29, 2017

So unless PR13994 is reverted, the only way forward is to use npm install @types/lodash@4.14.50

@NPrice99

This comment has been minimized.

NPrice99 commented Jan 29, 2017

I can confirm that the workaround detailed by pgonzal works successfully with the "Build Your Own WebPart" instructions.

@anishetty

This comment has been minimized.

anishetty commented Jan 30, 2017

hi. I am getting the same error even after trying the workaround suggested by pgonzal. I am trying to refer jquery file in my type script file for helloworld webpart using below import syntax. I get the same exception when tried to import moduleloader class using "@microsoft/sp-module-loader".

import * as jQuery from 'jquery';

@pgonzal pgonzal changed the title from Error - typescript - node_modules\@types\lodash\index.d.ts(245,25): error TS2304: Cannot find name 'Partial'. to SPFx Yeoman template broken by TypeScript 2.1 definition in @types/lodash Jan 30, 2017

@dgaeta dgaeta referenced this issue Jan 30, 2017

Closed

Cannot find name 'Partial' #14311

3 of 3 tasks complete
@adamrkerr

This comment has been minimized.

adamrkerr commented Feb 2, 2017

I am also receiving this error. Fresh install, first time through the demo.

The workaround solves the issue, but wanted to make known that it is still happening.

@NPrice99

This comment has been minimized.

NPrice99 commented Feb 2, 2017

see @pgonzal item above
As a workaround, you can run this command:
npm install @types/lodash@4.14.50

@tarcisiocorte

This comment has been minimized.

tarcisiocorte commented Feb 2, 2017

@dcu-sharepoint

This comment has been minimized.

dcu-sharepoint commented Feb 12, 2017

@anishetty when loading the jQuery lib in an RC0 webpart, you also have to load the jQuery typeScript types like so:

npm install @types/jquery

this should fix you issue.

hope this helps

@patmill

This comment has been minimized.

Contributor

patmill commented Feb 25, 2017

This is sorted in GA.

@muirgus

This comment has been minimized.

muirgus commented Apr 19, 2017

I was just going through the process of creating a hello world client web part and ran into the same problem that everyone else seems to be having.

There seem to be a number of workarounds for this issue, none of which appear to work for me.

I did npm install @types/lodash@4.14.50, but now getting:

Error - typescript - node_modules@types\es6-collections\index.d.ts(78,29): error TS2304: Cannot find name 'object'.
Error - typescript - node_modules@types\es6-collections\index.d.ts(87,20): error TS2304: Cannot find name 'object'.
Error - typescript - node_modules@types\es6-collections\index.d.ts(88,20): error TS2304: Cannot find name 'object'.
Error - typescript - node_modules@types\lodash\index.d.ts(19417,15): error TS2428: All declarations of 'WeakMap' must have identical type parameters.

These errors on a basic project have got to be a huge impediment to the adoption of Spfx.

Can someone outline in layman terms what is going on here?

@andy-ms

This comment has been minimized.

andy-ms commented Apr 19, 2017

@muirgus Looks like you have an older version of typescript installed. Try updating to at least 2.2.

@muirgus

This comment has been minimized.

muirgus commented Apr 19, 2017

Not sure what's happening here: Trying to install v.2.2.2, but comes back with earlier version.

λ npm install -g typescript@2.2.2
C:\Program Files\nodejs\tsc -> C:\Program Files\nodejs\node_modules\typescript\bin\tsc
C:\Program Files\nodejs\tsserver -> C:\Program Files\nodejs\node_modules\typescript\bin\tsserver
C:\Program Files\nodejs
`-- typescript@2.2.2

c:\dev\helloVue
λ tsc -v
message TS6029: Version 1.7.2

@andy-ms

This comment has been minimized.

andy-ms commented Apr 19, 2017

Check the output of get-command tsc?

@muirgus

This comment has been minimized.

muirgus commented Apr 19, 2017

doesn't recognize get-command

@andy-ms

This comment has been minimized.

andy-ms commented Apr 19, 2017

That's what powershell uses. On unix it's which.

@muirgus

This comment has been minimized.

muirgus commented Apr 19, 2017

PS C:\dev\helloVue> get-command tsc

CommandType Name Version Source


Application tsc.exe 1.7.40.... C:\Program Files (x86)\Microsoft SDKs\TypeScript\1.7\tsc.exe

@andy-ms

This comment has been minimized.

andy-ms commented Apr 19, 2017

Well, there's your problem. Hopefully you can just adjust your PATH.

@muirgus

This comment has been minimized.

muirgus commented Apr 19, 2017

I removed the typescript entry from my PATH but still having issues.

c:\dev\helloVue
λ gulp serve
Build target: DEBUG
[14:29:48] Using gulpfile c:\dev\helloVue\gulpfile.js
[14:29:48] Starting gulp
[14:29:48] Starting 'serve'...
[14:29:48] Starting subtask 'pre-copy'...
[14:29:48] Finished subtask 'pre-copy' after 17 ms
[14:29:48] Starting subtask 'copyStaticAssets'...
[14:29:48] Starting subtask 'sass'...
[14:29:49] Finished subtask 'sass' after 857 ms
[14:29:49] Starting subtask 'tslint'...
[14:29:49] Starting subtask 'typescript'...
[14:29:49] [typescript] Using custom version: 2.0.10
[14:29:49] Finished subtask 'copyStaticAssets' after 923 ms
[14:29:51] Error - typescript - node_modules@types\lodash\index.d.ts(11587,21): error TS1005: ']' expected.
[14:29:51] Error - typescript - node_modules@types\lodash\index.d.ts(11587,22): error TS1005: ';' expected.
[14:29:51] Error - typescript - node_modules@types\lodash\index.d.ts(11587,23): error TS1128: Declaration or statement
expected.
[14:29:51] Error - typescript - node_modules@types\lodash\index.d.ts(11587,33): error TS1005: ']' expected.
[14:29:51] Error - typescript - node_modules@types\lodash\index.d.ts(11587,34): error TS1005: ')' expected.
[14:29:51] Error - typescript - node_modules@types\lodash\index.d.ts(11587,35): error TS1128: Declaration or statement
expected.
[14:29:51] Error - typescript - node_modules@types\lodash\index.d.ts(11587,37): error TS1128: Declaration or statement
expected.
[14:29:51] Error - typescript - node_modules@types\lodash\index.d.ts(19580,1): error TS1128: Declaration or statement e
xpected.
[14:29:51] Finished subtask 'tslint' after 2.21 s
[14:29:51] Error - 'typescript' sub task errored after 2.21 s
"TypeScript error(s) occurred."
[14:29:51] 'serve' errored after 3.11 s
[14:29:51]
[14:29:52] ==================[ Finished ]==================
Error - typescript - node_modules@types\lodash\index.d.ts(11587,21): error TS1005: ']' expected.
Error - typescript - node_modules@types\lodash\index.d.ts(11587,22): error TS1005: ';' expected.
Error - typescript - node_modules@types\lodash\index.d.ts(11587,23): error TS1128: Declaration or statement expected.
Error - typescript - node_modules@types\lodash\index.d.ts(11587,33): error TS1005: ']' expected.
Error - typescript - node_modules@types\lodash\index.d.ts(11587,34): error TS1005: ')' expected.
Error - typescript - node_modules@types\lodash\index.d.ts(11587,35): error TS1128: Declaration or statement expected.
Error - typescript - node_modules@types\lodash\index.d.ts(11587,37): error TS1128: Declaration or statement expected.
Error - typescript - node_modules@types\lodash\index.d.ts(19580,1): error TS1128: Declaration or statement expected.
Error - 'typescript' sub task errored after 2.21 s
"TypeScript error(s) occurred."
[14:29:52] Project hello-vue version: 0.0.1
[14:29:52] Build tools version: 1.1.0
[14:29:52] Node version: v6.10.1
[14:29:52] Total duration: 6.7 s
[14:29:52] Task errors: 9

c:\dev\helloVue
λ tsc -v
Version 2.2.2

@andy-ms

This comment has been minimized.

andy-ms commented Apr 19, 2017

Gulp is probably using a locally installed typescript. Check your package.json dependencies to see what version you're using locally. (You may need to npm install after making changes to package.json.)

@muirgus

This comment has been minimized.

muirgus commented Apr 19, 2017

I think I installed Typescript earlier to explore what it was all about. I am going to uninstall everything and start again tomorrow.

@andy-ms

This comment has been minimized.

andy-ms commented Apr 19, 2017

In NPM with local installation, "uninstall everything" is just rm -r node_modules.

@muirgus

This comment has been minimized.

muirgus commented Apr 20, 2017

Typescript has now been updated to 2.2.2, but still getting errors:

c:\dev\helloVue
λ gulp serve
Build target: DEBUG
[10:47:52] Using gulpfile c:\dev\helloVue\gulpfile.js
[10:47:52] Starting gulp
[10:47:52] Starting 'serve'...
[10:47:52] Starting subtask 'pre-copy'...
[10:47:52] Finished subtask 'pre-copy' after 15 ms
[10:47:52] Starting subtask 'copyStaticAssets'...
[10:47:52] Starting subtask 'sass'...
[10:47:53] Finished subtask 'sass' after 793 ms
[10:47:53] Starting subtask 'tslint'...
[10:47:53] Starting subtask 'typescript'...
[10:47:53] [typescript] Using custom version: 2.0.10
[10:47:53] Finished subtask 'copyStaticAssets' after 852 ms
[10:47:55] Error - typescript - node_modules@types\es6-collections\index.d.ts(78,29): error TS2304: Cannot find name 'object'.
[10:47:55] Error - typescript - node_modules@types\es6-collections\index.d.ts(87,20): error TS2304: Cannot find name 'object'.
[10:47:55] Error - typescript - node_modules@types\es6-collections\index.d.ts(88,20): error TS2304: Cannot find name 'object'.
[10:47:55] Error - typescript - node_modules@types\lodash\index.d.ts(19417,15): error TS2428: All declarations of 'WeakMap' must have identical type parameters.
[10:47:55] Finished subtask 'tslint' after 2.2 s
[10:47:55] Error - 'typescript' sub task errored after 2.2 s
"TypeScript error(s) occurred."
[10:47:55] 'serve' errored after 3.04 s
[10:47:55]
[10:47:55] ==================[ Finished ]==================
Error - typescript - node_modules@types\es6-collections\index.d.ts(78,29): error TS2304: Cannot find name 'object'.
Error - typescript - node_modules@types\es6-collections\index.d.ts(87,20): error TS2304: Cannot find name 'object'.
Error - typescript - node_modules@types\es6-collections\index.d.ts(88,20): error TS2304: Cannot find name 'object'.
Error - typescript - node_modules@types\lodash\index.d.ts(19417,15): error TS2428: All declarations of 'WeakMap' must have identical type parameters.
Error - 'typescript' sub task errored after 2.2 s
"TypeScript error(s) occurred."
[10:47:56] Project hello-vue version: 0.0.1
[10:47:56] Build tools version: 1.1.0
[10:47:56] Node version: v6.10.1
[10:47:56] Total duration: 6.54 s
[10:47:56] Task errors: 5

c:\dev\helloVue
λ tsc -v
Version 2.2.2

@andy-ms

This comment has been minimized.

andy-ms commented Apr 20, 2017

[10:47:53] [typescript] Using custom version: 2.0.10

@muirgus

This comment has been minimized.

muirgus commented Apr 20, 2017

How would I remove 2.0.10? I don't see how I am creating so many versions.

@andy-ms

This comment has been minimized.

andy-ms commented Apr 20, 2017

Read the npm documentation. You could also just look at node_modules/typescript/package.json to see what got installed.

@muirgus

This comment has been minimized.

muirgus commented Apr 20, 2017

I am working from a fresh install and am still getting issues. I can understand getting issues when creating a working project, but this makes me really wonder the work involved with sharepoint framework going forward.

@tmasopust

This comment has been minimized.

tmasopust commented Apr 26, 2017

muirgus, I was having the exact same issue and error messages as you. Comparing notes with a colleague, I discovered that he was using a version 4.2.0 of the @Microsoft/sharepoint package while mine was 4.5. All attempts to uninstall the 4.5 failed. I finally uninstalled node from my machine and did a complete reinstall which got me back to the 4.2 and now everything builds and serves without error.

Under 4.5, the project was defaulting to typescript 2.0.10. I have no idea how I got on 4.5

@sptechmk

This comment has been minimized.

sptechmk commented Aug 26, 2017

@muirgus : Could you get past the error? I'm on typescript (tsc -v)2.4.2 and the issue persists.

@waldekmastykarz

This comment has been minimized.

Member

waldekmastykarz commented Aug 28, 2017

By default SPFx doesn't use tsc you have installed globally, but one that is included with SPFx which currently is v2.2.2. Unless you override it specifically, that's the version that you're using, even if you have a newer version of tsc installed on your machine. You can confirm the version used for building the project by running gulp build and checking the log.

@pgonzal

This comment has been minimized.

pgonzal commented Aug 28, 2017

The SPFx toolchain ships with a specific version of the TypeScript compiler. There are ways to override it (e.g. via TypeScriptConfiguration.setTypescriptCompiler() in your Gulpfile), however we generally recommend against that, because it will put you in an untested state. For small projects, the compiler doesn't matter that much, but for large code bases pretty much every single compiler upgrade causes some kind of regression or break (in our experience). The best workaround is to downgrade to a version of your typings that is compatible with your compiler. Since @types projects don't follow SemVer and specify their indirect dependencies using a wildcard, in some cases you may need to add an indirect dependency to your package.json file as well.

BTW our core toolchain already upgraded to TypeScript 2.4. This will ship in the next release of SPFx, which is right around the corner.

@sptechmk

This comment has been minimized.

sptechmk commented Aug 29, 2017

Im trying to build a simple Jquery Client WebPart and my package.json looks like this:
image
And I continue to get the error as below on gulp server:
image

Is there anything more for me to check apart from the all the above suggestions? Looking forward to hearing from the team.

@waldekmastykarz

This comment has been minimized.

Member

waldekmastykarz commented Aug 29, 2017

You're using the pre-release version of the SharePoint Framework. I suggest, you update your SharePoint Framework Yeoman generator to the latest version (v1.1.3 at this moment), create a new project, and either copy your code over to the new one or compare the differences and update your existing project.

@simkessy

This comment has been minimized.

simkessy commented Dec 11, 2018

So just to confirm, if I bring in some random package from npm, there's a chance it might not work with SPFx because SPFx is using an older version of Typescript and the typings for packages I bring in might be too up to date for SPFx to keep up with?

Right now I'm trying to use Axios which is a very popular React Http client but it won't work because:

Error - typescript - node_modules\axios\index.d.ts(50,33): error TS1005: ',' expected.
Error - typescript - node_modules\axios\index.d.ts(66,32): error TS1005: ',' expected.
Error - typescript - node_modules\axios\index.d.ts(110,12): error TS1005: ',' expected.
Error - typescript - node_modules\axios\index.d.ts(111,8): error TS1005: ',' expected.
Error - typescript - node_modules\axios\index.d.ts(114,9): error TS1005: ',' expected.
Error - typescript - node_modules\axios\index.d.ts(115,8): error TS1005: ',' expected.
Error - typescript - node_modules\axios\index.d.ts(116,10): error TS1005: ',' expected.

@patmill

This comment has been minimized.

Contributor

patmill commented Dec 11, 2018

At the moment, yes. We're working on a system that will allow people to define an updated version of typescript, while still making sure that the various pieces of the toolchain are reliable.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment