Autosize not working with webpack in Laravel

[udanpe]

resources/assets/js/app.js
require('autosize/dist/autosize');
autosize($('.textarea-auto-height'));
npm run dev
Uncaught ReferenceError: autosize is not defined
at Object. (app.js:11026)
at webpack_require (app.js:20)
at Object. (app.js:11008)
at webpack_require (app.js:20)
at app.js:63
at app.js:66

if change autosize.js all working
autosize($('.textarea-auto-height'));
// module.exports = autosize;

[jackmoore]

It's in UMD module format, so you'll want to assign your require to a variable. Some something like const autosize = require('autosize/dist/autosize'). You should also be able shorten that to const autosize = require('autosize') because the package.json lists /dist/autosize.js as the entry/main file.

[udanpe]

jackmoore, Thanks!

[gatesplan]

Looks like same issue happens to me, but not working with const autosize = require('..');

in resources/js/app.js file, I wrote
const autosize = require('autosize/dist/autosize');

and repacking..

in html page,
autosize(document.getElementById('ta') makes an error Uncaught ReferenceError

[jackmoore]

@gatesplan I think the problem is that when you import autosize as a module it is no longer provided as a global (this is just how the UMD modules work, see the conditional logic for that at top of the dist/autosize file). You should make that global yourself if you want to use autosize outside of the scope in which it was imported.

[nemchik]

If anyone else comes looking for another way to do this:

import autosize from "autosize";
global.autosize = autosize;

[ignorantrahul]

here a simple solution
in your resources/js/app.js
add this code
autosize = require('autosize');

`