NPM run dev error after requiring Tailwind CSS - node.js

I'm just dipping my toes into using Laravel for the first time, and I've had many issues so far. I've figured them out myself so far, but this one is driving me crazy!
After adding the line require('tailwindcss') in my webpack.mix.js file, I keep getting the following error when I run.
npm run dev
✖ Mix
Compiled with some errors in 452.52ms
ERROR in ./resources/css/app.css
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/dist/cjs.js):
TypeError: Cannot read property 'config' of undefined
at getTailwindConfig (/home/timothy/blog/node_modules/tailwindcss/lib/lib/setupTrackingContext.js:81:62)
at /home/timothy/blog/node_modules/tailwindcss/lib/lib/setupTrackingContext.js:124:92
at /home/timothy/blog/node_modules/tailwindcss/lib/processTailwindFeatures.js:41:11
at plugins (/home/timothy/blog/node_modules/tailwindcss/lib/index.js:20:104)
at LazyResult.runOnRoot (/home/timothy/blog/node_modules/postcss/lib/lazy-result.js:339:16)
at LazyResult.runAsync (/home/timothy/blog/node_modules/postcss/lib/lazy-result.js:393:26)
at LazyResult.async (/home/timothy/blog/node_modules/postcss/lib/lazy-result.js:221:30)
at LazyResult.then (/home/timothy/blog/node_modules/postcss/lib/lazy-result.js:206:17)
at processResult (/home/timothy/blog/node_modules/webpack/lib/NormalModule.js:751:19)
at /home/timothy/blog/node_modules/webpack/lib/NormalModule.js:853:5
at /home/timothy/blog/node_modules/loader-runner/lib/LoaderRunner.js:399:11
at /home/timothy/blog/node_modules/loader-runner/lib/LoaderRunner.js:251:18
at context.callback (/home/timothy/blog/node_modules/loader-runner/lib/LoaderRunner.js:124:13)
at Object.loader (/home/timothy/blog/node_modules/postcss-loader/dist/index.js:142:7)
1 ERROR in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)
webpack compiled with 2 errors
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! /home/timothy/.npm/_logs/2022-01-18T04_24_37_451Z-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! /home/timothy/.npm/_logs/2022-01-18T04_24_37_460Z-debug.log
I've looked into my version of Node.js and PostCSS being an issue, as my version of node.js has been an issue that caused other problems I've had so far, but those two seem fine. If it matters, this is a Laravel project created with Composer on Ubuntu 20.04 with Laravel installer 4.2.9.

Just run this comman. Tailwind config file is missing.
npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init

Related

Nestjs failed to deploy on cpanel

I'm trying to deploy my backend application on cpanel and I'm getting an error like this
what should i do to solve this problem?
> test3#0.0.1 start /home/nandaken/inventory
> nest start
stderr:
npm WARN lifecycle The node binary used for scripts is /home/nandaken/nodevenv/inventory/12/bin/node but npm is using /opt/alt/alt-nodejs12/root/usr/bin/node itself. Use the `--scripts-prepend-node-path` option to include the path for the node binary npm was executed with.
sh: nest: command not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! test3#0.0.1 start: `nest start`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the test3#0.0.1 start 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! /home/nandaken/.npm/_logs/2023-01-28T08_16_43_494Z-debug.log
Looks like cpanel is calling the startscript which is running nest start. More than likely, you only have production dependencies installed, so #nestjs/cli isn't installed because it is a devDependency. Either configure cpanel to call a different start script (like start:prod which should map to node dist/main) or change your start script to run the proper js file (like node dist/main). The other option would be to install #nestjs/cli as a production dependency, but I wouldn't suggest that

NextJS not running on MacOS even after installing modules

So I've just created a NextJS project using create-next-app which went smoothly as expected. Then ran npm i just to be sure and saw all modules installed into node_modules
When I try to run npm run dev to start my nextjs app. it just says
sh: next: command not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! test#0.1.0 dev: `next dev`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the test#0.1.0 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! /Users/john.v.n.pakson/.npm/_logs/2022-10-06T08_01_29_725Z-debug.log
It seems like npm is not detecting the node_modules i have installed.
Not sure if this is a mac or a zsh issue.
I'm using node version 12.22.12
Upgraded to 16.17.1 and still see the same error
> test#0.1.0 dev
> next dev
/var/folders/6y/xtlzp4z16dj0stxnqx8znj8w0000gn/T/dev-01c08137.sh: line 1: next: command not found
Okay I figured it out. It was caused by my file path on macos. My project was on a folder called Project/Test which might have confused zsh or mac. This in turn caused npm to not be able to find the correct scripts on my node_modules
When I moved my project to another folder I was already able to run npm run dev properly.
Cheers!

next.js error: Error: > Build failed because of webpack errors

I'm trying to deploy a nextJs app but when I run npm run build I see some of the errors listed below:
Build error occurred
Error:
Build failed because of webpack errors
at /Users/hassan/Upwork/ROCProjectNext.js/ROCNext/node_modules/next/dist/build/index.js:15:918
at runMicrotasks ()
at processTicksAndRejections (internal/process/task_queues.js:93:5)
at async /Users/hassan/Upwork/ROC Project Next.js/ROC- Next/node_modules/next/dist/build/tracer.js:1:525
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! admin-1.0#0.1.0 build: next build
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the admin-1.0#0.1.0 build 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!
/Users/hassan/.npm/_logs/2021-04-07T06_52_28_325Z-debug.log
any suggestions?
Kindly check your nextjs version in package.json file it is upgraded to latest version. Downgrade the version of nextjs it will help you to avoid this error.

How install Vue JS + TailwindCss in Laravel 8.29.0

started installing plugins to my Laravel project.
Laravel new public
npm install
composer require laravel / ui
php artisan ui vue
npm install -D tailwindcss # latest postcss # latest autoprefixer # latest
npx tailwindcss init
add line in tailwind.config.js purge: [ './resources//*.blade.php', './resources//.js',
'./resources/**/.vue', ],
add line in webpack.mix.js require ("tailwindcss"),
Add im resource / css / app.css 3-line #tailwind base; #tailwind components; #tailwind utilities;
add link stylesheet in main template file (main.blade.php) {{asset ('css / app.css')}}
After all the monipulations mentioned above, I execute the command npm install && npm run dev, and I get an error
> npm run development
> # development D:\laravel\public
> mix
× Mix
Compiled with some errors in 6.30s
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 https://webpack.js.org/concepts#loaders
> <template>
| <div>
| <h3>Hey</h3>
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\****\AppData\Roaming\npm-cache\_logs\2021-02-26T09_06_38_033Z-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\***\AppData\Roaming\npm-cache\_logs\2021-02-26T09_06_38_066Z-debug.log
Would you try these two solutions
1 - Run MacOS Or Windows super user
1.1 MacOS sudo npm run development
1.2 Windows right click terminal open with Administrator
2- Cleen code to

Problem starting Electron app - [603:0827/215406.435140:FATAL:electron_main_delegate.cc(264)] Running as root without --no-sandbox is not supported

I am trying to set up a electron project. I have followed this tutorial and the previous ones.
But when I get to "Running your App" and type npm start, I get the following message:
myApp#1.0.0 start ***PATH***
electron .
[603:0827/215406.435140:FATAL:electron_main_delegate.cc(264)] Running as root without --no-sandbox is not supported. See https://crbug.com/638180.
***PATH***/node_modules/electron/dist/electron exited with signal SIGTRAP
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! myApp#1.0.0 start: `electron .`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the myApp#1.0.0 start 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! /home/tobias/.npm/_logs/2020-08-27T11_54_06_541Z-debug.log
npm version: 6.14.6
node.js version: 12.18.3
I'm using the WSL terminal in Visual Studio code.
I have tried installing the electron-quick-start package with the same outcome.
I don't know if it helps but in your package.json try changing the start script into
"start": "electron --no-sandbox ."

Resources