SOLVED

SPFx Error Running Sample - Error: File to import not found or unreadable: node_modules/office-ui-fa

%3CLINGO-SUB%20id%3D%22lingo-sub-191865%22%20slang%3D%22en-US%22%3ESPFx%20Error%20Running%20Sample%20-%20Error%3A%20File%20to%20import%20not%20found%20or%20unreadable%3A%20node_modules%2Foffice-ui-fa%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-191865%22%20slang%3D%22en-US%22%3E%3CP%3EHi%20All%2C%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI'm%20trying%20to%20run%20the%20following%20sample%3A%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Fgithub.com%2FSharePoint%2Fsp-dev-fx-webparts%2Ftree%2Fmaster%2Fsamples%2Freact-list-form%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fgithub.com%2FSharePoint%2Fsp-dev-fx-webparts%2Ftree%2Fmaster%2Fsamples%2Freact-list-form%3C%2FA%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20navigated%20to%20the%20folder%20and%20ran%20%22npm%20i%22%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EWhen%20I%20run%20%22gulp%20serve%22%20I%20get%20the%20following%20error%3A%3CBR%20%2F%3E%3CBR%20%2F%3EError%20in%20plugin%20'sass'%3CBR%20%2F%3EMessage%3A%3CBR%20%2F%3Esrc%5Ccommon%5C_theming.module.scss%3CBR%20%2F%3EError%3A%20File%20to%20import%20not%20found%20or%20unreadable%3A%20node_modules%2Foffice-ui-fabric-react%2Fdist%2Fsass%2FReferences.%3CBR%20%2F%3EParent%20style%20sheet%3A%20C%3A%3CMY%20local%3D%22%22%20path%3D%22%22%3E%2Fsp-dev-fx-webparts-master%2Fsamples%2Freact-list-form%2Fsrc%2Fcommon%2F_theming.module.scss%3CBR%20%2F%3Eon%20line%201%20of%20src%2Fcommon%2F_theming.module.scss%3CBR%20%2F%3E%26gt%3B%26gt%3B%20%26nbsp%3B%40import%20'~office-ui-fabric-react%2Fdist%2Fsass%2FReferences'%3B%3C%2FMY%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3ETo%20be%20honest%2C%20I've%20no%20idea%20where%20to%20start%20with%20figuring%20out%20what's%20wrong.%26nbsp%3B%20I've%20googled%20for%20answers%20but%20nothing%20really%20made%20sense.%26nbsp%3B%20I%20know%20that's%20all%20a%20bit%20vague%2C%20but%20if%20anyone%20can%20give%20me%20a%20kick%20in%20the%20right%20direction%20that%20would%20be%20great.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThanks...%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EJohn%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-199386%22%20slang%3D%22en-US%22%3ERe%3A%20SPFx%20Error%20Running%20Sample%20-%20Error%3A%20File%20to%20import%20not%20found%20or%20unreadable%3A%20node_modules%2Foffice-u%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-199386%22%20slang%3D%22en-US%22%3E%3CP%3EI%20was%20attempting%20to%20do%20the%20same%20thing%20with%20the%20same%20webpart%20and%20received%20the%20same%20errors.%20After%20researching%20it%20I%20came%20across%20this%20post%20which%20resolved%20my%20issue.%20Hope%20it%20helps.%26nbsp%3B%3C%2FP%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Fgithub.com%2FSharePoint%2Fsp-dev-fx-webparts%2Fissues%2F497%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fgithub.com%2FSharePoint%2Fsp-dev-fx-webparts%2Fissues%2F497%3C%2FA%3E%3C%2FP%3E%3C%2FLINGO-BODY%3E
Highlighted
Contributor

Hi All,

 

I'm trying to run the following sample: https://github.com/SharePoint/sp-dev-fx-webparts/tree/master/samples/react-list-form

 

I navigated to the folder and ran "npm i"

 

When I run "gulp serve" I get the following error:

Error in plugin 'sass'
Message:
src\common\_theming.module.scss
Error: File to import not found or unreadable: node_modules/office-ui-fabric-react/dist/sass/References.
Parent style sheet: C:<my local path>/sp-dev-fx-webparts-master/samples/react-list-form/src/common/_theming.module.scss
on line 1 of src/common/_theming.module.scss
>>  @import '~office-ui-fabric-react/dist/sass/References';

 

To be honest, I've no idea where to start with figuring out what's wrong.  I've googled for answers but nothing really made sense.  I know that's all a bit vague, but if anyone can give me a kick in the right direction that would be great.

 

Thanks...

 

John

1 Reply
Highlighted
Solution

I was attempting to do the same thing with the same webpart and received the same errors. After researching it I came across this post which resolved my issue. Hope it helps. 

https://github.com/SharePoint/sp-dev-fx-webparts/issues/497