SyntaxError: Unexpected token: punc (.) in 3rd party css - css

I try to run
✗ gulp build:dist
and i get this error:
events.js:160
throw er; // Unhandled 'error' event
^
GulpUglifyError: unable to minify JavaScript
Caused by: SyntaxError: Unexpected token: punc (.)
File: /Users/eladb/.../public/js/min/vendor.js
Line: 110474
It has no stack in my code, so i have opened vendor.js at line 110474
all i saw is an error in css of 3rd party component.
})(window, window.angular);
.lf-ng-md-file-input {
margin-top: 5px;
margin-bottom: 5px;
}
.lf-ng-md-file-input .lf-ng-md-file-input-preview-container {
how can i fix it if it's not my css code?

Related

How to paste multi line code in Meteor shell

When I paste a multi line code like
const f = () => {
console.log("Hello");
};
in Meteor shell, it seems to be that every line is executed. I get this Error:
};
^
Uncaught SyntaxError: Unexpected token '}'
Is there a chance to paste multi line code in Meteor shell? It would be helpful in order to try out some code snippets.

Angular 14 Error: Transform failed with 1 error: ERROR: Unterminated string token

When running ng serve I have this result:
*./src/main.ts - Error: Module build failed
(from./node_modules/#ngtools/webpack/src/ivy/index.js)
../.component.scss:17:100: ERROR: Unterminated string token
*./src/polyfills.ts` - Error: Module build failed
(from./node_modules/#ngtools/webpack/src/ivy/index.js)
../.component.scss:17:100: ERROR: Unterminated string token
This angular version
Angular CLI: 14.0.6
Node: 16.16.0
Package Manager: NPM 8.14.0
OS: win32 x64
Angular: 14.0.6
Package Version
---------------------------------------------------------
#angular-devkit/architect 0.1400.6
#angular-devkit/build-angular 14.0.6
#angular-devkit/core 14.0.6
#angular-devkit/schematics 14.0.6
`#angular/cdk 14.0.5`
#angular/material 14.0.5
#nguniversal/express-engine 7.1.1
#schematics/angular 14.0.6
`rxjs 6.6.7`
typescript 4.6.4
/.component.scss
input[type=text]:disabled {
color: black;
}
.search-row {
.form-group > label {
font-size: 1.1em !important;
color: black;
}
}
.mat-table {
th.mat-header-cell {
font-size: 1.1em !important;
color: black;
}
}//<< here line 17.
#block {
margin: 0% 10%;
}
...
thank you for your help
For anyone landing there, temporarily set optimization: false in your angular.json file. The will allow to see the real error.
In my case it was an unsupported stylesheet import. But it can be any error thrown by Webpack sass-loader.
I added the "path/name" of the scss files in angular.json->projects->project name ->architect->build->options->styles as following then I could find the exact scss issues.
{
...
"projects": {
...
"my-project": {
...
"architect": {
"build": {
...
"options": {
...
"styles": [
...
"src/scss/style.scss",
"src/app/components/playlistDetail/playlist-detail.component.scss",
...
]
}
},
Then I could see Sass error as following.
./src/app/components/items/viewitem/viewitem.component.ts - Error: Module build failed (from ./node_modules/#ngtools/webpack/src/ivy/index.js):
Error: Transform failed with 1 error:
E:/f2022_indy/front/src/app/components/fan/fan.component.scss:17:100: ERROR: Unterminated string token
./src/app/components/fan/fan.component.scss - Error: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Expected whitespace.
╷
89 │ #media screen and(max-width: 767px) {
│ ^
╵
src\app\components\fan\fan.component.scss 89:26 root stylesheet
Run the following command
npx browserslist --update-db
For anyone that still has this issue, you can set optimization: false in your angular.json file and rebuild to see the real error with details and then put optimization: true back.
for me the error was that i had an $dark-color variable that is undefined.
I upgraded angular project from 5.2 to 14, I saw this error and its not displayed from which file the error came from.
I tried optimization: false in angular.json file but it did not work since upgrade converted .angular-cli.json to angular.json and json structure seems to be wrong.
I created a new sample project with angular and moved angular.json file from there to upgraded project folder, then changed optimization: false
This time errors shown are specific with line and file name. I resolved those errors in project css files and able to do ng serve

container is not defined error for geochart

Uncaught (in promise): Error: Container is not defined
nhandled Promise rejection: Container is not defined ; Zone: angular ; Task: Promise.then ; Value: Error: Container is not defined
how to solve this error
You can try this..
single-page-app
single-page-app2
i hope this is very useful.

Node-SASS Compiler fails - Invalid CSS

I am trying to compile a .sass file using the node-sass module from a nodejs application. However the compile fails with an Invalid CSS Error.
Here is my SCSS:
body {
background: rgb(255, 0, 0);
}
Here is the full error message:
Original Error: { [Error: Invalid CSS after "body {": expected "}", was "{"]
status: 1,
file: 'C:/localhost/NodeJS-Server/private/sass/style.sass',
line: 2,
column: 7,
message: 'Invalid CSS after "body {": expected "}", was "{"',
formatted: 'Error: Invalid CSS after "body {": expected "}", was "{"\n on line 2 of private/sass/style.sass\n>> body { {\n ------^\n' }
I have no idea where this second '{' comes from.
SCSS files use the .scss extension, not .sass. The two formats have a different syntax.
Read about the differences here: https://responsivedesign.is/articles/difference-between-sass-and-scss

Why am I getting a "expected '}' but found '{'" error in dotless?

I have tried to append the values using +_ in less, but it throws the error
expected '}' but found '{'
in the dotless compiler. What did I miss?
.gradient(#brow){
#{brow}+_: ~"; background: #{brow}linear-gradient(top";
// some content
}
}
The error indicates in this lineL #{brow}+_:.

Resources