SPFx with jquery & sp-pnp-js: definitive project start activity?

Joseph Ackerman
Iron Contributor
Apr 30, 2017
Well, looks like we are back to square one. I am getting the red squiggly and the "sp-pnp-js" not found again. Friday afternoon, everything was just fine as I mentioned in my last post but rebooting my machine today I got this:

PS C:\projects\quicklinks> gulp serve
Build target: DEBUG
[18:04:09] Using gulpfile C:\projects\quicklinks\gulpfile.js
[18:04:09] Task 'C:\Users\joseph_ackerman\AppData\Roaming\npm\gulp.cmd' is not in your gulpfile
[18:04:09] Please check the documentation for proper gulpfile formatting
[18:04:09] Task 'C:\Users\joseph_ackerman\AppData\Roaming\npm\gulp.cmd' is not in your gulpfile
[18:04:09] Please check the documentation for proper gulpfile formatting
About to exit with code: 1
Process terminated before summary could be written, possible error in async code not continuing!
Trying to exit with exit code 1

Then two minutes later, I tried again and instead of that response, I got the old one that is embedded as an image above in this thread with these:

[18:21:53] Error - typescript - src\webparts\quicklinks\QuicklinksWebPart.ts(21,16): error TS2307: Cannot find module 'sp-pnp-js'.

I am left thinking only that my boot up sequence is somehow breaking the tool chain. Being new to all of this new CLI stuff (the old ones I understood and wrote many C and Clipper programs back in the 80's), I haven't the faintest idea what to do next. Very frustrating. I can't even express how much I hate this. When I build SP Add-ins with Visual Studio and NuGet, it just *works*. Starting every work day with a new "WTF?" moment is no fun.

This new process is too fragile: too many vendors, too many interlocking tools expecting to much of each other's output, not enough *specific* error information when things fail. I committed to the Microsoft stack back in the early 90's because they had the best tools and superior documentation (at the time, Visual Basic was *awesome*). Now it's "Use these 5 other things and if it doesn't work, tough". Sorry for the rant, but this is crazy-making. Thanks for listening.
- Andrew Connell
  MVP
  Apr 30, 2017
  I understand the frustration, but your characterization at the end isn't really fair. I'm not a fan of the huge dependency tree or at least the way they've rolled it out today (NPM shrinkwrap would have been better... or dependency tree that isn't nearly as big).
  
  We've dealt with this before... I recall SharePoint developers waking up only to have COM+ issues happen seemingly overnight for no reason.
  
  Question: did you use the repo that someone created above to get the error?
  
  Can you run the following at the command line and paste the results for each one?
  
  node -v npm -v npm list -g --depth=0
  - Joseph Ackerman
    Iron Contributor
    May 03, 2017
    Further testing has turned up some interesting facts:
    
    The colleague who tested this with me on Monday and had the same issues as I did on his corporate-issued development box, went through the process again on a different machine, his own personal gaming box running Windows 10. On that box, it worked perfectly, even after a reboot. So: non-corporate image running W10 -- OK.
    
    My next thought was to test on a non-corporate image W7 box. It occured to me (belatedly, duh) that I was under-utilizing my free Azure allocation, so I created a clean new W7 VM and installed all the tooling and libraries there. Amazingly, everything worked as it should, including the integration of the additional jquery and sp-pnp-js, even after a reboot. So: non-corporate image running W7 -- OK.
    
    Given that the troubles both of us had were on our corporate-imaged/managed laptops, and given the fact that the diagnostics you asked for revealed this:
    
    PS C:\projects\quicklinks> npm list -g --depth=0
    C:\Users\joseph_ackerman\AppData\Roaming\npm
    +-- @microsoft/generator-sharepoint@1.0.2
    +-- gulp@3.9.1
    `-- yo@1.8.5
    
    I have concluded that there must be some IT-mandated configuration of our security software, or perhaps some sort of enforced Windows policy, that does not like something it is finding in that appdata\roaming\npm path. If npm is putting .JS or .JSON files somewhere down that tree, it may be that my system configuration (as enforced by my company) sees those files as a threat and is removing or renaming them. That feels like a very plausible theory for the behavior I and my colleague have been experiencing.
    
    I'm tired of researching this instead of learning how to actually use SPFx and sp-pnp-js, so rather than taking on Corporate IT Don Quixote-style and trying to make an exception for me and my team, it looks like my SPFx work will be in that Azure VM for the time being. I just have to remember to stop the instance running when I finish my work day!
    
    Thanks for your help and interest (and to everyone who contributed). On to my next challenge!
Joseph Ackerman
Iron Contributor
Apr 28, 2017

>>my theory that is something related with the framework installed. Did you try to re-install the entire spfx?<<

I started fresh and reinstalled everything, and now plain vanilla gulp serve with just the imports statements for the jquery and sp-pnp-js libraries seems to be working. Good call on the reinstall of the SPFx.

Of course now I've got some other issues...but that needs to be its own thread ;)

Thanks for your help.
Joseph Ackerman
Iron Contributor
Apr 28, 2017
Will try it. Thanks Luis.

Forum Discussion

SPFx with jquery & sp-pnp-js: definitive project start activity?

Resources