🐞 tslint-microsoft-contrib missing in dependency chain causing tsline build error when using PNPM (extra work req. for PNPM usage)

[andrewconnell]

Category

• Question
• Typo
• Bug
• Additional article idea

Expected or Desired Behavior

Running pnpm install should get all dependencies so when building the project, it builds with no errors.

Observed Behavior

When you run pnpm install, you don't get the tslint-microsoft-contrib package. To get it, you must run pnpm install --shamefully-flatten. This causes a linting error when building:

> gulp build
...
[12:18:50] Error - [tslint] Failed to load /../tslint.json: Could not find custom rule directory: tslint-microsoft-contrib

Ref: https://pnpm.js.org/docs/en/faq.html#pnpm-does-not-work-with-your-project-here

Steps to Reproduce

• create a new project with the SPFx Yeoman generator: yo @microsoft/genereator --skip-install

• run pnpm install

• run gulp build

• observe linting error listed above

• use solution 2 from the PNPM FAQ: run pnpm install --shamefully-flatten

  add --force to rebuild the node_modules folder without having to delete it

• run gulp build

• observe no tslinting errors

Confirmed in SPFx v1.7.0

[patmill]

I noticed this yesterday. It looks like an issue with PNPM itself, as the tslint-microsoft-contrib package is listed as a dependency of the @microsoft/sp-tslint-rules package, but it isn't getting pulled down. We'll reach out to Zoltan and see what's going on. He's normally extremely helpful and responsive.

[andrewconnell]

I noticed that too... but couldn't track down the cause. Wonder if it's an issue between a scoped package referencing an unscoped package?

[patmill]

What version of pnpm are you using? I'm on the latest, but I'm going to downgrade to 2.15.1 and see if it still happens. :( still happens. We're digging in further.

[patmill]

OK, we sorted this out. It sounds like (according to @iclanton ) an issue with tslint, where they don't correctly resolve node dependencies. We're looking at submitting a PR to tslint, but in the meantime if you add "tslint-microsoft-contrib": "5.2.1", as a dev dependency, it should work. We'll look at patching the generator to do that manually if the fix to tslint takes a while to prop.

[andrewconnell]

Great find... thanks @patmill !

[wobba]

If I run

yo @microsoft/sharepoint --skip-install
pnpm install
pnpm install tslint-microsoft-contrib@5.2.1 --save-dev
gulp

I now get

[13:53:11] Error - [tslint] { Error: Cannot find module 'tslint'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\repos\Demo1\node_modules\.registry.npmjs.org\tslint-microsoft-contrib\5.2.1\node_modules\tslint-m
crosoft-contrib\noFunctionExpressionRule.js:13:12)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3) code: 'MODULE_NOT_FOUND' }

@patmill Do I still need to use flatten, or is what would the proper order of commands be?

[patmill]

@wobba - yeah, looks like that suggestion doesn't work. We'll keep digging into this.

[AJIXuMuK]

With SPFx 1.8.2 I'm getting

Error - [tslint] { Error: Cannot find module 'typescript'
    at Function.Module._resolveFilename (module.js:548:15)
    at Function.Module._load (module.js:475:25)
    at Module.require (module.js:597:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:/Projects/Tests/pnpm/node_modules/.registry.npmjs.org/tslint/5.9.1/node_modules/tslint/lib/language/walker/blockScopeAwareRuleWalker.js:20:10)
    at Module._compile (module.js:653:30)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)
    at tryModuleLoad (module.js:506:12)
    at Function.Module._load (module.js:498:3) code: 'MODULE_NOT_FOUND' }

[wobba]

--shamefully-flatten still work as a workaround