I have been trying this for about 2 days. And i got another solution that is replace this code mix.js('resources/js/app.js', 'public/js') .vue() .sass('resources/sass/app.scss', 'public/css'); add this code mix.js('resources/js/app.js', 'public/js').vue(); mix.sass('resources/sass/app.scss', 'public/css'); but now I prefer your following step. Thanks man 💗💗💗
Thanks Dary. I was having this issue every time I compile resources. Only way to get around was to delete npm and nodejs and re-install which was really ruining my experience using laravel mix and npm. I will try your method and see how I go.
Hello Mr. Dary, I'm here because the command PHP artisan UI tailwindcss --auth didn't work. After trying bootstrap option, it came with mix not recognize error. Thanks, it worked finally
@@codewithdary Pls sir, there's another error again, the css setting didn't work as expected, I tried going through the css file to correct the settings with my little css knowledge, not all worked, any help with this?
this video was very helpful to me. but if you don't to use frontend-presets and continue with php artisan ui vue --auth then you need to install react only like php artisan ui react and boom you are good to go.
Not sure but you actually installed React with Bootstrap 4 (as you can see in the compiled css). Just to clear this out... I don't think there is an easy way to install React with Tailwind, the only way I could think of would be to install the Tailwind presets and install React manually on top of that. Despite of that, thanks for the videos!!!
No, your completely right. I tried to show what would happen if you pull in both or one. The error will remain the same! Thank you for sharing your knowledge!
This means, on your local machine, you haven't made any SSH keys. Not to worry. Here's how to fix: help.github.com/articles/adding-a-new-ssh-key-to-your-github-account/
In my case there are 34 vulnerabilities. But in the end after running npm install && npm run dev twice, it gets compiled successfully. But tailwind isn't working :(
Hi, Darry I was watching your larval series which has 34 videos. When I reached " how to compile assets video ". I faced this error. Now I followed all steps like u but I still faced the same error when i executed the command "npm install && npm run dev " at the last. after following all steps I checked the public folder, there are no CSS or js folders under the public folder. Plz help me I shall be thankful to you for this act of kindness
Hello. I've been getting this error that I can not seem to be able to solve. Regular expression Denial of Service. It seems to be because of the postcss. I've searched a lot of stuff on internet but could not find anything to help me fix it. Can u help me?
"php artisan ui tailwindcss --auth" command adds an older version of laravel-mix (5.0 or something) to package.json file. Before running "npm install" manually change version to 6.0.18 in package.json (or whatever the latest version at the moment of reading this comment) and then run "npm install" so the latest version of laravel-mix is installed. This solved the issue for me.
Hey man! Thanks for the video. I have an old application using Laravel 5.8 that I'm restart to use and I'm facing this exactly issue. I did what you said, it does install ok, but still not working when running npm run dev. I'll try to paste the error here, or just a little part: npm ERR! @ development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js` npm ERR! Exit status 2 npm ERR! npm ERR! Failed at the @ development script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. Let me show you some versions: npm -v: 6.13.4 nvm -v: 6.39.2 node -v: v8.17.10 macOS High Sierra 10.13 Do you have any ideas or a solution? Thanks and sorry for the long comment 😶
Hey, just want to came across to say if you are using node -v 14.16.0 you will get this error even if the project it's ok on its structure, so, using a LTS node version works fine!!! Long story short: This workaround does not work for me Thanks!
I am a total beginner and trying to do my first practice project ..and I have a error like this…Can someone help me with this, Please!😅😂 I already installed node.js too. But it didn't work The Mix manifest does not exist. npm run install npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again. At line:1 char:1 + npm run install + ~~~ + CategoryInfo : ObjectNotFound: (npm:String) [], CommandNotFoundException npm install laravel-mix --save-dev npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again. At line:1 char:1 + npm install laravel-mix --save-dev + ~~~ + CategoryInfo : ObjectNotFound: (npm:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException npm remove laravel-mix npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again. At line:1 char:1 + npm remove laravel-mix + ~~~ + CategoryInfo : ObjectNotFound: (npm:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException
Please check this. What type of problem is this ======================= ❯ nvm --version 0.35.3 ❯ node -v v12.14.0 ❯ npm --version 6.13.4 ❯ cd /opt/lampp/htdocs/laravel/school ❯ npm remove laravel-mix npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead. npm ERR! Unexpected end of JSON input while parsing near '...n-transform-block-sco' npm ERR! A complete log of this run can be found in: npm ERR! /home/gm/.npm/_logs/2022-05-02T06_35_11_027Z-debug.log ❯ npm install laravel-mix --save-dev npm ERR! Unexpected end of JSON input while parsing near '...n-transform-block-sco' npm ERR! A complete log of this run can be found in: npm ERR! /home/gm/.npm/_logs/2022-05-02T06_35_28_917Z-debug.log ❯ npm install cross-env --save-dev npm notice created a lockfile as package-lock.json. You should commit this file. + cross-env@7.0.3 added 7 packages from 5 contributors and audited 7 packages in 1.689s found 0 vulnerabilities ❯ npm install && npm run dev npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead. npm ERR! Unexpected end of JSON input while parsing near '...n-transform-block-sco' npm ERR! A complete log of this run can be found in: npm ERR! /home/gm/.npm/_logs/2022-05-02T06_36_12_743Z-debug.log ====================== Thanks in advance sir
I still have the same problem... npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.3.2 (node_modules\chokidar ode_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.3.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"ia32"}) npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"ia32"}) audited 1207 packages in 23.407s 97 packages are looking for funding run `npm fund` for details found 35 moderate severity vulnerabilities run `npm audit fix` to fix them, or `npm audit` for details > @ dev C:\Users\t-ott\OneDrive\Escritorio\superate_mensajeria > npm run development > @ development C:\Users\t-ott\OneDrive\Escritorio\superate_mensajeria > mix × Mix Compiled with some errors in 17.14s ERROR in ./resources/js/components/ExampleComponent.vue 1:0 Module parse failed: Unexpected token (1:0) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See webpack.js.org/concepts#loaders > | | webpack compiled with 1 error npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! @ development: `mix` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the @ development script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\t-ott\AppData\Roaming pm-cache\_logs\2021-05-13T03_45_06_687Z-debug.log npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! @ dev: `npm run development` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the @ dev script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\t-ott\AppData\Roaming pm-cache\_logs\2021-05-13T03_45_06_869Z-debug.log
LETS CONNECT THROUGH INSTAGRAM.
instagram.com/codewithdary
after 5 hours of digging the web I find the solution in 5 minutes. Thanks a lot
Love to hear them :)
I m here from the 6 & half hour laravel video . Great job Dary.
Hope you enjoyed it!
DAAARRRYYYY......................YOU ARE THE BEST BRO! YOU JUST GOT A SUBSCRIBER...ONE LOVE
I love to hear that buddy! Thank you.
I have been trying this for about 2 days. And i got another solution that is
replace this code
mix.js('resources/js/app.js', 'public/js')
.vue()
.sass('resources/sass/app.scss', 'public/css');
add this code
mix.js('resources/js/app.js', 'public/js').vue();
mix.sass('resources/sass/app.scss', 'public/css');
but now I prefer your following step. Thanks man 💗💗💗
Dary, you are the best Laravel teacher out there
Thank you man. There are loads of great content creators out there as well!
Thanks Dary. I was having this issue every time I compile resources. Only way to get around was to delete npm and nodejs and re-install which was really ruining my experience using laravel mix and npm. I will try your method and see how I go.
Love to hear that :)
Amazing video, Helped me! Thanks so much!
Interesting that you need to uninstall laravel-mix to fix this issue. But it worked for me.
Probably one of the reasons why Laravel is using Vite now :)
It worked..... finally.thank u. You save my day
Glad I could help
muchisimas gracias mi amigo, me has quitado un tremendo dolor de cabeza.. gracias
Hello Mr. Dary, I'm here because the command PHP artisan UI tailwindcss --auth didn't work. After trying bootstrap option, it came with mix not recognize error. Thanks, it worked finally
Awesome! :D
@@codewithdary Pls sir, there's another error again, the css setting didn't work as expected, I tried going through the css file to correct the settings with my little css knowledge, not all worked, any help with this?
i liked this one, if you have any other tips or methods that are really important. i will be glad to know them as a beginner
Thank you, Mohamed. I will keep it in mind!
Nice one bro i am doing your tutorials and had this issue for a while, always says mix not found... sweet :)
You love to see it Hugo! Thanks!
this video was very helpful to me. but if you don't to use frontend-presets and continue with php artisan ui vue --auth then you need to install react only like php artisan ui react and boom you are good to go.
That works fine too, yes!
Worked like a charm. Thank you! Keep it up!
You're welcome!
thank you so much sir this is very helpful for me😊
Most welcome Hasina!
thanks from Colombia.
Thank you so much Alexis!
i wish u do more laravel project like e-commerce or any othe project for practice and upload it on free host so we can do that also
I will think about it Ahmed! Thanks for sharing your ideas.
Thank you Dary,
You are so welcome
Not sure but you actually installed React with Bootstrap 4 (as you can see in the compiled css). Just to clear this out... I don't think there is an easy way to install React with Tailwind, the only way I could think of would be to install the Tailwind presets and install React manually on top of that. Despite of that, thanks for the videos!!!
No, your completely right. I tried to show what would happen if you pull in both or one. The error will remain the same! Thank you for sharing your knowledge!
very very nice you help me 💖
Glad to hear that Abdalla :)
Thank you million, sir. You saved my holiday
You are most welcome
Thank you very much, you made my day wonderful
My pleasure 😊
thank you this works for me
Wow, happy that this is still helpful :)
THANKS THANKS THANKS, your video is superbe
Thank you so much Ben!
Thank you!!! I've solved..😂👍
Happy to help! :D
thanks brother, you save my life. but in last command im still error with npm run dev, work with npm run development
i like this,,, solved thnks bro !!
You're welcome!
Thanks was very interesting
Glad you enjoyed it
Didn't work for me, but you got a subscriber
Still the same error? You can run npm audit fix -force and then npm install
@@codewithdary yup, still the same error even after running audit fix
Did you run the npm install command first, then the npm audit and npm install again?
@@codewithdary I did yeah, I’ve tried several different solutions that I found on stackoverflow and it always got the same error
same bro same fkin error
Not working, still getting error after running last command
Thanks man.
No problem Araz!
I'm getting a public key error when I run "npm install laravel-mix --save-dev"
This means, on your local machine, you haven't made any SSH keys. Not to worry. Here's how to fix: help.github.com/articles/adding-a-new-ssh-key-to-your-github-account/
In my case there are 34 vulnerabilities. But in the end after running npm install && npm run dev twice, it gets compiled successfully. But tailwind isn't working :(
execute this 2 extra commands and it will work fine
npm cache clear --force
npm install
npm run dev
Really helpfull. Thanks.
That is awesome..u r great
Thank you Bayan!
Good job
Thanks!!
thanks broo, it does work
Welcome 👍
Hi, Darry I was watching your larval series which has 34 videos. When I reached " how to compile assets video ". I faced this error. Now I followed all steps like u but I still faced the same error when i executed the command "npm install && npm run dev " at the last. after following all steps I checked the public folder, there are no CSS or js folders under the public folder. Plz help me I shall be thankful to you for this act of kindness
Hello. I've been getting this error that I can not seem to be able to solve. Regular expression Denial of Service. It seems to be because of the postcss. I've searched a lot of stuff on internet but could not find anything to help me fix it. Can u help me?
In my setup, npm deleted automatically after running php artisan ui tailwindcss --auth or npm install
That's even better!
When I write npm install & & npm run dev=====> it say (& &) is not a valid statement separator in this version 🙄🙄⁉️⁉️⁉️⁉️⁉️
You have a space in-between which is not needed
@@codewithdary I didn't wrote this space in powershell
then you should run them separately.
@@codewithdary it say that the npm is undefined..
I hv gotta 2 vulnerabilities while removing laravel-mix. Hence cld nt install & run npm successfully
sir I am getting error while using yarn run dev (next js) please help sir.
[webpack-cli] TypeError: mix.js is not a function
How to solve this..please help
You are the best
You are the best! :)
"php artisan ui tailwindcss --auth" command adds an older version of laravel-mix (5.0 or something) to package.json file. Before running "npm install" manually change version to 6.0.18 in package.json (or whatever the latest version at the moment of reading this comment) and then run "npm install" so the latest version of laravel-mix is installed. This solved the issue for me.
Thanks for sharing!!
Thank's its wort it
Thank you! :)
thanks bro i have solve my problem
Nice nice :)
This didn't work for me, I keep getting this message: Error: Unknown option '--hide-modules'
finally it's work
Glad it helped!
Hey man! Thanks for the video. I have an old application using Laravel 5.8 that I'm restart to use and I'm facing this exactly issue. I did what you said, it does install ok, but still not working when running npm run dev. I'll try to paste the error here, or just a little part:
npm ERR! @ development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the @ development script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Let me show you some versions:
npm -v: 6.13.4
nvm -v: 6.39.2
node -v: v8.17.10
macOS High Sierra 10.13
Do you have any ideas or a solution? Thanks and sorry for the long comment
😶
I recommend you to not spin up a Laravel 5.8 version at all. It uses PHP 7.1.3, which has not been supported for a long time.
Maybe I should upgrade to v6?
@@MarcelloPato you know Laravel is already spinning up version 9s right?
Yeah, but it is a long way from 5.8 to 9.
@@MarcelloPato it’s the same process as 5.8 to any other. It doesn’t make a difference. You should refactor the code into a new project
it doesn't work for me! and i'm still looking for a solution :((
&& is not a valid statement separator in this version
I got error when i run command npm run dev
Might be good to mention which one ;)
Top top thank you
Thank you too!
Better make a complete ecommerce 💖
Might do it in the future! :)
@@codewithdary I am waiting for it :)
thanks
You’re welcome Ivan!
damn bro, thx verry much
No worries Ghazian!!
Hey, just want to came across to say if you are using node -v 14.16.0 you will get this error even if the project it's ok on its structure, so, using a LTS node version works fine!!!
Long story short: This workaround does not work for me
Thanks!
Love from Pakistan ❤
Love from the Netherlands! :)
I am a total beginner and trying to do my first practice project ..and I have a error like this…Can someone help me with this, Please!😅😂
I already installed node.js too. But it didn't work
The Mix manifest does not exist.
npm run install
npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the
name, or if a path was included, verify that the path is correct and try again.
At line:1 char:1
+ npm run install
+ ~~~
+ CategoryInfo : ObjectNotFound: (npm:String) [], CommandNotFoundException
npm install laravel-mix --save-dev
npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the
name, or if a path was included, verify that the path is correct and try again.
At line:1 char:1
+ npm install laravel-mix --save-dev
+ ~~~
+ CategoryInfo : ObjectNotFound: (npm:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException
npm remove laravel-mix
npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the
name, or if a path was included, verify that the path is correct and try again.
At line:1 char:1
+ npm remove laravel-mix
+ ~~~
+ CategoryInfo : ObjectNotFound: (npm:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException
Please check this. What type of problem is this
=======================
❯ nvm --version
0.35.3
❯ node -v
v12.14.0
❯ npm --version
6.13.4
❯ cd /opt/lampp/htdocs/laravel/school
❯ npm remove laravel-mix
npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm ERR! Unexpected end of JSON input while parsing near '...n-transform-block-sco'
npm ERR! A complete log of this run can be found in:
npm ERR! /home/gm/.npm/_logs/2022-05-02T06_35_11_027Z-debug.log
❯ npm install laravel-mix --save-dev
npm ERR! Unexpected end of JSON input while parsing near '...n-transform-block-sco'
npm ERR! A complete log of this run can be found in:
npm ERR! /home/gm/.npm/_logs/2022-05-02T06_35_28_917Z-debug.log
❯ npm install cross-env --save-dev
npm notice created a lockfile as package-lock.json. You should commit this file.
+ cross-env@7.0.3
added 7 packages from 5 contributors and audited 7 packages in 1.689s
found 0 vulnerabilities
❯ npm install && npm run dev
npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm ERR! Unexpected end of JSON input while parsing near '...n-transform-block-sco'
npm ERR! A complete log of this run can be found in:
npm ERR! /home/gm/.npm/_logs/2022-05-02T06_36_12_743Z-debug.log
======================
Thanks in advance sir
I still have the same problem...
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.3.2 (node_modules\chokidar
ode_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.3.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"ia32"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"ia32"})
audited 1207 packages in 23.407s
97 packages are looking for funding
run `npm fund` for details
found 35 moderate severity vulnerabilities
run `npm audit fix` to fix them, or `npm audit` for details
> @ dev C:\Users\t-ott\OneDrive\Escritorio\superate_mensajeria
> npm run development
> @ development C:\Users\t-ott\OneDrive\Escritorio\superate_mensajeria
> mix
× Mix
Compiled with some errors in 17.14s
ERROR in ./resources/js/components/ExampleComponent.vue 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See webpack.js.org/concepts#loaders
>
|
|
webpack compiled with 1 error
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ development: `mix`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ development script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\t-ott\AppData\Roaming
pm-cache\_logs\2021-05-13T03_45_06_687Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ dev: `npm run development`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\t-ott\AppData\Roaming
pm-cache\_logs\2021-05-13T03_45_06_869Z-debug.log
thanks
Welcome! :)
Better make a complete ecommerce 💖