Simple project config results in typescript compilation error "Could not find a declaration file for module 'lodash'"

[astegmaier]

Bug Report

Importing the package and using it in a basic typescript app results in the typescript error Could not find a declaration file for module 'lodash'.

This error can be fixed if you manually install @types/lodash (by running yarn add @types/lodash -D). However, for a good developer experience, this shouldn't be necessary - (perhaps @types/lodash should be among the dependencies of the package, or included through some other build mechanism).

Steps

I've made a sample repo that demonstrates the issue - repo steps are in the README there.

To reproduce from scratch, here are the high-levels steps.

1. Set up a simple "hello-world" typescript + react project using the tooling chain of your choice.
2. Add fluent-ui-react to the project.
3. Add a simple button component to your app.

Expected Result

TSC should compile without warnings.

Actual Result

node_modules/@fluentui/react/dist/es/components/Carousel/Carousel.d.ts:3:20 - error TS7016: Could not find a declaration file for module 'lodash'. '/Users/Andrew/Projects/fluent-ui-react-test/node_modules/lodash/lodash.js' implicitly has an 'any' type.
  Try `npm install @types/lodash` if it exists or add a new declaration (.d.ts) file containing `declare module 'lodash';`

3 import * as _ from 'lodash';
                     ~~~~~~~~

node_modules/@fluentui/react/dist/es/components/Dropdown/Dropdown.d.ts:3:20 - error TS7016: Could not find a declaration file for module 'lodash'. '/Users/Andrew/Projects/fluent-ui-react-test/node_modules/lodash/lodash.js' implicitly has an 'any' type.
  Try `npm install @types/lodash` if it exists or add a new declaration (.d.ts) file containing `declare module 'lodash';`

3 import * as _ from 'lodash';
                     ~~~~~~~~

node_modules/@fluentui/react/dist/es/utils/applyAccessibilityKeyHandlers.d.ts:2:20 - error TS7016: Could not find a declaration file for module 'lodash'. '/Users/Andrew/Projects/fluent-ui-react-test/node_modules/lodash/lodash.js' implicitly has an 'any' type.
  Try `npm install @types/lodash` if it exists or add a new declaration (.d.ts) file containing `declare module 'lodash';`

2 import * as _ from 'lodash';
                     ~~~~~~~~

Version

0.43.0

Testcase

See the sample repo I created.

I investigated creating a sample on codesandbox.io, but it appears that they use react-scripts to do the compilation, which won't check (I think) for errors in npm packages the way that tsc does.

[layershifter]

Hey @astegmaier, thanks for reporting!

We have some projects tests to avoid such issues, but we missed this. I opened #2323 to catch this and going to provide a fix there.