Cannot compile SPFx Drop 4 and MDL2 under VS2015

Highlighted
Occasional Contributor

I was trying to import SPFx Drop4 project to VS2015 by following the instruction on dev.office.com and wasn't able to compile it from VS2015. The following is the error message:

23:01:44] Error - typescript - src\webparts\helloWorld\HelloWorldWebPart.d.ts(6,14): error TS1005: '=' expected.

[23:01:44] Error - typescript - src\webparts\helloWorld\HelloWorldWebPart.d.ts(6,34): error TS1005: ';' expected.

[23:01:45] Error - 'typescript' sub task errored after 6.47 s "TypeScript error(s) occurred."

[23:01:45] 'serve' errored after 9.71 s

[23:01:45] Error - typescript - src\webparts\helloWorld\HelloWorldWebPart.d.ts(6,14): error TS1005: '=' expected.Error - typescript - src\webparts\helloWorld\HelloWorldWebPart.d.ts(6,34): error TS1005: ';' expected.Error - 'typescript' sub task errored after 6.47 

 

The line 6 on HelloWorldWebPart.d.ts is

    readonly propertyPaneSettings: IPropertyPaneSettings;

Other than that, the line 8 in HelloWorldWebPart.ts alway showed the error message for import scss.

 

import styles from './HelloWorld.module.scss';

 

the solution can be compiled and run at command line through "gulp serve". The compile issue was just happen in VS2015.

 

My dev environment:

VS2015 with Update3

node.js: 4.6.0

npm: 3.10.8

 

 

Anyone know the workaround?

 

This is a question I moved from SPFx with Visual Studio 2015 and would like to have better visibility as a new topic.

 

Thanks

4 Replies
Highlighted

Not sure about the whole thing but I've had issues with

 

import styles from './HelloWorld.module.scss';

before as in reality the "styles" variable only exists in the "HelloWorld.module.scss.ts" file which is only created when it's first compiled. It might be an indication that it's not building the various scripts in the right order or just a side effect of an earlier error.

Highlighted
Highlighted

the instruction you provide was for upgrade. what I did was to update to Drop4 version and create a brand new SharePoint Framework project based on that.

As I said, I also followed the instruction Use Visual Studio to develop SharePoint client-side web parts and got that error message. it seems like the visual studio instruction is out-of-date.

One thing I want to mention is the code is working if I just run "gulp serve" from command line.

Highlighted

I just tried the latest Drop5 version and it seems VS2015 was able to compile and start IE to point to workbench.aspx on my local. I guess the reason behind might be becuase I used TypeScript v2.0 for Drop4. Since the latest Drop 5 is using TypeScript V2.0 and it should fix the problem.