Why does my babel-chaining (&&) does not work? - firebase

I`m doing a tutorial on server-side-rendering with React/Express/Firebase.
This tutorial was created in 2017 and unfortunately, I struggle on the script section with babel in which I try to chain some commands.
Please take note that each command for itself works fine, but chaining them leads to the following error:
**Der Befehl "node_modules" ist entweder falsch geschrieben oder konnte nicht gefunden werden.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! nonssr#1.0.0 babel: babel src -d functions/src && node_modules/.bin/babel index.js -d
functions
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the nonssr#1.0.0 babel 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\Thorsten\AppData\Roaming\npm-cache_logs\2020-03-16T08_46_28_887Z-debug.log**
The script command is th following:
"scripts": {
"babel": "node_modules/.bin/babel src -d functions/src && node_modules/.bin/babel index.js -d functions"
},
Is there a general mistake in this line of code?
Do you need additional code to analyse the mistake?
Best regards!

I found the solution by myself, but maybe someone can explain why it is like it is.
This code works:
"scripts": {
"babel": "node_modules/.bin/babel src -d functions/src && babel index.js -d functions"
},
I had to remove the second "node_modules/.bin/babel ...", just typed in "babel ..."

Related

Can't build assets on deploy - Symfony 5/Encore/Ux

I have a Symfony 5 application, i'm using webpack Encore / Ux for the first time.
I'm facing difficulties with deployment, only the HTML is displayed at the URL ; the "build" directory is almost empty, it only contains "entrypoints.json" and "manifest.json". the assets aren't compiled.
When im running npm run build to compile the assets in production i have this message :
sh: encore: command not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! # build: encore production --progress
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the # build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
The build script in the package.json doesnt work :
"scripts": {
"dev-server": "encore dev-server",
"dev": "encore dev",
"watch": "encore dev --watch",
"build": "encore production --progress"
}
and i have no idea to where does this come from.
Would someone have something for this ?
i ran npm run build and it doesnt work, but it does in dev mode
Before deploying to production server you need to Compile Assets for Production on your dev server.
Then deploy only the built assets.
The process is documented here:
https://symfony.com/doc/current/frontend/encore/faq.html#how-do-i-deploy-my-encore-assets

Problem with CSS module not found when deploying to vercel

This is the error log. And I cannot for the life of me fix this. everything works fine in dev but on deployment it fails. :(
23:12:53.687 Failed to compile.
23:12:53.687 ModuleNotFoundError: Module not found: Error: Can't resolve '../../styles/Homebody.module.css' in '/vercel/workpath0/components/Home'
23:12:53.687 > Build error occurred
23:12:53.688 Error: > Build failed because of webpack errors
23:12:53.688 at /vercel/workpath0/node_modules/next/dist/build/index.js:15:918
23:12:53.689 at runMicrotasks (<anonymous>)
23:12:53.689 at processTicksAndRejections (internal/process/task_queues.js:93:5)
23:12:53.689 at async /vercel/workpath0/node_modules/next/dist/build/tracer.js:3:470
23:12:53.704 npm ERR! code ELIFECYCLE
23:12:53.704 npm ERR! errno 1
23:12:53.707 npm ERR! next_front#0.1.0 build: `next build && next export`
23:12:53.707 npm ERR! Exit status 1
23:12:53.707 npm ERR!
23:12:53.707 npm ERR! Failed at the next_front#0.1.0 build script.
23:12:53.707 npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
23:12:53.714 npm ERR! A complete log of this run can be found in:
23:12:53.714 npm ERR! /vercel/.npm/_logs/2021-02-24T23_12_53_708Z-debug.log
23:12:53.719 Error: Command "npm run build" exited with 1
One thing is to start all .module.css files with a capital letter. Sometimes. however, you will still get the same error. To make matters worse, the error keeps occurring for varying .module.css files. So sometimes you will get A.module.css not found, and another time you get B.module.css not found.
I then deleted node_modules and ran npm i. No result; same error.
What did work for me was to make a new project with:
yarn create next-app
…and then add all the files from the old module one by one while redeploying the app each time to check it still works.
This isn't elegant, but it's fast enough and it does the trick.
This is an old question but I hope I can help someone in the future!
I was able to solve this issue by moving my CSS module file out of a subfolder into the root Styles folder.
Before:
-Styles
--Pages
---FileName.module.css
After:
-Styles
--FileName.module.css

Cannot npn run sass

I am in folder C:\Users\borka\Desktop\Courses\HTML & CSS (Traversy)\Sandbox\13_sass, using a bash terminal in VSCode and npm version 6.14.8.
I have successfully run npm init -y and npm install node-sass, then edited the package.json file to contain "scripts": { "sass": "node-sass -w scss/ -o dist/css/ --recursive" }.
Then, I created a scss directory with main.scss inside, as well as a dist directory. And finally, I run npm run sass, but it fails and here's what I get:
> 13_sass#1.0.0 sass C:\Users\borka\Desktop\Courses\HTML & CSS (Traversy)\Sandbox\13_sass
> node-sass -w scss/ -o dist/css/ --recursive
'CSS' is not recognized as an internal or external command,
operable program or batch file.
internal/modules/cjs/loader.js:883
throw err;
^
Error: Cannot find module 'C:\Users\borka\Desktop\Courses\node-sass\bin\node-sass'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
at Function.Module._load (internal/modules/cjs/loader.js:725:27)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
at internal/main/run_main_module.js:17:47 {
code: 'MODULE_NOT_FOUND',
requireStack: []
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! 13_sass#1.0.0 sass: `node-sass -w scss/ -o dist/css/ --recursive`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the 13_sass#1.0.0 sass 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\borka\AppData\Roaming\npm-cache\_logs\2021-01-31T16_01_42_707Z-debug.log
Notice how the Error: Cannot find module line displays a totally wrong path, one that doesn't even exist.
I've never worked with sass before and I have no idea what the problem is.
I can't make a comment yet, but I think that the package you are looking for to compile your SASS into CSS is this one. I noticed your using node-sass instead of regular sass. You can install it by running:
npm install -g sass
To install it globally on your system, and then compile your SASS.
Try with the one I'm sharing, or, if your are using an IDE like VSCode, you can dowload an extension like Live Sass Compiler (that's the one I normally use).
Apparently the ampersand in the path was the cause. I removed it from folder name "HTML & CSS", and now everything's fine.

Firebase Cloud Functions Invalid tag name "glob" error in my Command Line

I following this link to organize my firebase cloud functions and not have all my code in one index.ts file. However, when I'm running the line:
npm i -S glob, camelcase
in my console, it's retuning this:
npm ERR! code EINVALIDTAGNAME
npm ERR! Invalid tag name "glob,": Tags may not have any characters that encodeURIComponent encodes.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/johndoe/.npm/_logs/2018-12-24T19_46_03_264Z-debug.log
Use npm i glob camelcase instead. The comma is not correct here. The -S is not even a documented flag for npm (at least not on the man page for my installation).

Laravel 5 & Webpack SASS - How to Add Another CSS File

I´m trying to add another file to webpack.mix.js in Laravel 5.4, but when I do that, I have an error in compilation.
This works:
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css');
This doesn't work:
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css')
.sass('resources/assets/sass/web.scss', 'public/css');
How can I add another CSS to webpack into separate files?
EDIT
The error:
npm ERR! Darwin 16.6.0 npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "dev" npm ERR! node v6.10.0 npm ERR! npm v3.10.10 npm ERR! code ELIFECYCLE npm ERR! # dev: node node_modules/webpack/bin/webpack.js --progress --hide-modules --config=$npm_package_config_webpack npm ERR! Exit status 2 npm ERR! npm ERR! Failed at the # dev script 'node node_modules/webpack/bin/webpack.js --progress --hide-modules --config=$npm_package_config_webpack'
Solution provided by Ross Wilson:
One thing you could try is deleting your node_modules directory and then reinstalling your dependencies (npm install).
It works for me.
You need to append all of the scss files into a array like so
mix.js('resources/assets/js/app.js', 'public/js')
.sass([
'resources/assets/sass/app.scss',
'resources/assets/sass/web.scss'], 'public/css');
This will output a single CSS file.

Resources