search

adrienpoly / stimulus-flatpickr

A modest, yet powerful wrapper of Flatpickr 📆 for Stimulus
MIT License
415 stars 30 forks source link

Could not find a declaration file for module 'stimulus-flatpickr' #50

Closed abhinaykumar closed 4 years ago

abhinaykumar commented 4 years ago

Hi, I tried importing the stimulus-flatpickr for my rails app but at the time of compilation it returns an error like this:

00:13:37 webpack.1 | ERROR in ./node_modules/stimulus-flatpickr/dist/index.m.js
00:13:37 webpack.1 | Module not found: Error: Can't resolve 'flatpickr' in '/XYZ/XYZ/node_modules/stimulus-flatpickr/dist'
00:13:37 webpack.1 | resolve 'flatpickr' in '/XYZ/XYZ/node_modules/stimulus-flatpickr/dist'
00:13:37 webpack.1 |   Parsed request is a module
00:13:37 webpack.1 |   using description file: /XYZ/XYZ/node_modules/stimulus-flatpickr/package.json (relative path: ./dist)
00:13:37 webpack.1 |     Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |     resolve as module
00:13:37 webpack.1 |       looking for modules in /XYZ/XYZ/app/javascript
00:13:37 webpack.1 |         using description file: /XYZ/XYZ/package.json (relative path: ./app/javascript)
00:13:37 webpack.1 |           Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |           using description file: /XYZ/XYZ/package.json (relative path: ./app/javascript/flatpickr)
00:13:37 webpack.1 |             no extension
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr doesn't exist
00:13:37 webpack.1 |             .tsx
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.tsx doesn't exist
00:13:37 webpack.1 |             .ts
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.ts doesn't exist
00:13:37 webpack.1 |             .mjs
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.mjs doesn't exist
00:13:37 webpack.1 |             .js
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.js doesn't exist
00:13:37 webpack.1 |             .sass
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.sass doesn't exist
00:13:37 webpack.1 |             .scss
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.scss doesn't exist
00:13:37 webpack.1 |             .css
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.css doesn't exist
00:13:37 webpack.1 |             .module.sass
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.module.sass doesn't exist
00:13:37 webpack.1 |             .module.scss
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.module.scss doesn't exist
00:13:37 webpack.1 |             .module.css
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.module.css doesn't exist
00:13:37 webpack.1 |             .png
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.png doesn't exist
00:13:37 webpack.1 |             .svg
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.svg doesn't exist
00:13:37 webpack.1 |             .gif
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.gif doesn't exist
00:13:37 webpack.1 |             .jpeg
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.jpeg doesn't exist
00:13:37 webpack.1 |             .jpg
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr.jpg doesn't exist
00:13:37 webpack.1 |             as directory
00:13:37 webpack.1 |               /XYZ/XYZ/app/javascript/flatpickr doesn't exist
00:13:37 webpack.1 |       /XYZ/XYZ/node_modules/stimulus-flatpickr/dist/node_modules doesn't exist or is not a directory
00:13:37 webpack.1 |       /XYZ/XYZ/node_modules/stimulus-flatpickr/node_modules doesn't exist or is not a directory
00:13:37 webpack.1 |       /XYZ/XYZ/node_modules/node_modules doesn't exist or is not a directory
00:13:37 webpack.1 |       /XYZ/XYZ/node_modules doesn't exist or is not a directory
00:13:37 webpack.1 |       /XYZ/XYZ/node_modules doesn't exist or is not a directory
00:13:37 webpack.1 |       /Users/node_modules doesn't exist or is not a directory
00:13:37 webpack.1 |       /node_modules doesn't exist or is not a directory
00:13:37 webpack.1 |       looking for modules in /XYZ/XYZ/node_modules
00:13:37 webpack.1 |         using description file: /XYZ/XYZ/package.json (relative path: ./node_modules)
00:13:37 webpack.1 |           Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |           using description file: /XYZ/XYZ/package.json (relative path: ./node_modules/flatpickr)
00:13:37 webpack.1 |             no extension
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr doesn't exist
00:13:37 webpack.1 |             .tsx
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.tsx doesn't exist
00:13:37 webpack.1 |             .ts
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.ts doesn't exist
00:13:37 webpack.1 |             .mjs
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.mjs doesn't exist
00:13:37 webpack.1 |             .js
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.js doesn't exist
00:13:37 webpack.1 |             .sass
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.sass doesn't exist
00:13:37 webpack.1 |             .scss
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.scss doesn't exist
00:13:37 webpack.1 |             .css
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.css doesn't exist
00:13:37 webpack.1 |             .module.sass
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.module.sass doesn't exist
00:13:37 webpack.1 |             .module.scss
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.module.scss doesn't exist
00:13:37 webpack.1 |             .module.css
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.module.css doesn't exist
00:13:37 webpack.1 |             .png
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.png doesn't exist
00:13:37 webpack.1 |             .svg
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.svg doesn't exist
00:13:37 webpack.1 |             .gif
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.gif doesn't exist
00:13:37 webpack.1 |             .jpeg
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.jpeg doesn't exist
00:13:37 webpack.1 |             .jpg
00:13:37 webpack.1 |               Field 'browser' doesn't contain a valid alias configuration
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr.jpg doesn't exist
00:13:37 webpack.1 |             as directory
00:13:37 webpack.1 |               /XYZ/XYZ/node_modules/flatpickr doesn't exist
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.tsx]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.ts]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.mjs]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.js]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.sass]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.scss]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.css]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.module.sass]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.module.scss]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.module.css]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.png]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.svg]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.gif]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.jpeg]
00:13:37 webpack.1 | [/XYZ/XYZ/app/javascript/flatpickr.jpg]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/stimulus-flatpickr/dist/node_modules]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/stimulus-flatpickr/node_modules]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/node_modules]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules]
00:13:37 webpack.1 | [/Users/node_modules]
00:13:37 webpack.1 | [/node_modules]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.tsx]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.ts]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.mjs]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.js]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.sass]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.scss]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.css]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.module.sass]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.module.scss]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.module.css]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.png]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.svg]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.gif]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.jpeg]
00:13:37 webpack.1 | [/XYZ/XYZ/node_modules/flatpickr.jpg]
00:13:37 webpack.1 | ℹ ｢wdm｣: Failed to compile.

and VSCode throws and error like this:

module "/XYZ/node_modules/stimulus-flatpickr/dist/index"
Could not find a declaration file for module 'stimulus-flatpickr'. '/XYZ/node_modules/stimulus-flatpickr/dist/index.js' implicitly has an 'any' type.
  Try `npm install @types/stimulus-flatpickr` if it exists or add a new declaration (.d.ts) file containing `declare module 'stimulus-flatpickr';`ts(7016)

I followed the instructions provided on the readme. Can you please confirm if this is a genuine error or I missed something?

Application details:

Rails: 6.0.3
Ruby: 2.7.1
Webpacker: 4.0

Please let me know if you need more details.

Thanks a lot for creating this plugin!!

adrienpoly commented 4 years ago

Hey

You need to add also Flatpickr yarn add flatpickr

stimulus-flatpickr is just a wrapper

This should solve it

If you feel the readme is not clear feel free to submit a PR

abhinaykumar commented 4 years ago

Thank you @adrienpoly , That solved the issue. I have added a bunch of minor details on Readme which I feel would be useful for someone who is trying it out for the first time and needs more handholding 🙂. Made a PR for the same. Thanks again!!