Compiling with Mix

[Admitry93]

Hi all, I have a problem with compiling style and script files after installation. I use laravel 10 and php 8.1. I didn't change any settings during the installation. When I run this command - npm run canvas.ui.dev, I get this error:

npm run canvas.ui.dev

canvas.ui.dev
mix

✖ Mix
Compiled with some errors in 1.14s

Deprecation Warning: Passing percentage units to the global abs() function is deprecated.
In the future, this will emit a CSS abs() function to be resolved by the browser.
To preserve current behavior: math.abs(100%)
To emit a CSS abs() now: abs(#{100%})
More info: https://sass-lang.com/d/abs-percent

╷
54 │ $dividend: abs($dividend);
│ ^^^^^^^^^^^^^^
╵
node_modules/bootstrap/scss/vendor/_rfs.scss 54:14 divide()
node_modules/bootstrap/scss/mixins/_grid.scss 66:15 row-cols()
node_modules/bootstrap/scss/mixins/_grid-framework.scss 43:13 @content
node_modules/bootstrap/scss/mixins/_breakpoints.scss 65:5 media-breakpoint-up()
node_modules/bootstrap/scss/mixins/_grid-framework.scss 32:5 make-grid-columns()
node_modules/bootstrap/scss/_grid.scss 72:3 @import
node_modules/bootstrap/scss/bootstrap.scss 16:9 @import
resources/sass/canvas-ui.scss 236:9 root stylesheet

ERROR in ./resources/js/canvas-ui/app.js 5:0-33
Module not found: Error: Can't resolve './mixins/base' in '/Users/dimaalferov/Documents/Projects/ton/resources/js/canvas-ui'
Did you mean 'base.js'?
BREAKING CHANGE: The request './mixins/base' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '.mjs' file, or a '.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
Did you miss the leading dot in 'resolve.extensions'? Did you mean '[".",".wasm",".mjs",".js",".jsx",".json",".vue"]' instead of '["",".wasm",".mjs",".js",".jsx",".json",".vue"]'?

ERROR in ./resources/js/canvas-ui/app.js 7:0-30
Module not found: Error: Can't resolve './routes' in '/Users/dimaalferov/Documents/Projects/ton/resources/js/canvas-ui'
Did you mean 'routes.js'?
BREAKING CHANGE: The request './routes' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '.mjs' file, or a '.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
Did you miss the leading dot in 'resolve.extensions'? Did you mean '[".",".wasm",".mjs",".js",".jsx",".json",".vue"]' instead of '["",".wasm",".mjs",".js",".jsx",".json",".vue"]'?

webpack compiled with 2 errors

Any ideas how I can fix it?

[classicAmitIn]

I also ran into this similar problem a few days ago and I resolved it by removing "type": "module" from package.json file and recompiled using npm run canvas.ui.dev

[austintoddj]

It looks like Laravel 10 added the type block like @ay379 mentioned above. Assuming this was to support Vite.