Tag Archives: Sass

[Solved] Error: Node Sass does not yet support your current environment

2022-06-13-node-saas error

System environment

  • node -v v16.15.0
  • node-gyp -v v3.8.0
  • System Darwin 21.3.0

Screenshot of error reporting

The local code execution npm install depends on the installation items. The console displays an error message. The screenshot of the error message is as follows:

Error reporting solution

The project relies on “node-sass”: “^4.12.0”. Replace node-sass with sass

  • implementnode uninstall node-sass
  • Execute node install sass, the installation is successful. The screenshot is as follows:

The project can be started normally, and the interface is as follows:

Error report analysis:

  • The node version is 16.15.0, the system environment is the macOS m1 version, and node-sass has not yet been adapted, so the resulting
  • Replace node-sass with sass

Reference:

https://stackoverflow.com/questions/68095626/node-sass-with-apple-m1-big-sur-and-arm64

[Solved] Vue Project Error: Module build failed: Error: Missing binding

Train of thought

Through the error message, we can see that the core problem is that the sass file cannot be found in the dependent file. This prompts us to reinstall sass

1. Switch to the dependent folder of the current project through CD, that is, node_modules file, and then run the command to install sass. The command is as follows

npm rebuild node-sass

2 . Then switch to the project folder and run the command to update it. The command is as follows:

npm update

3. Finally, run the command to start the project

npm run dev

[Solved] start value has mixed support, consider using flex-start instead

postcss-loader Error => start value has mixed support, consider using flex-start instead”

Details of error reporting:

 warning  in ./src/views/olympicdataquery/personnellist/personaldetails/personaldetails.vue?vue&type=style&index=0&id=87659618&scoped=true&lang=scss&

Module Warning (from ./node_modules/postcss-loader/src/index.js):
Warning

(97:7) start value has mixed support, consider using flex-start instead

 @ ./node_modules/vue-style-loader??ref--8-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--8-oneOf-1-2!./node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/olympicdataquery/personnellist/personaldetails/personaldetails.vue?vue&type=style&index=0&id=87659618&scoped=true&lang=scss& 4:14-524 15:3-20:5 16:22-532
 @ ./src/views/olympicdataquery/personnellist/personaldetails/personaldetails.vue?vue&type=style&index=0&id=87659618&scoped=true&lang=scss&
 @ ./src/views/olympicdataquery/personnellist/personaldetails/personaldetails.vue
 @ ./src/views sync ^\.\/.*$
 @ ./src/store/modules/permission.js
 @ ./src/store/index.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://192.168.1.78:6206&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

Although just a warning, but certainly what is not standardized, chrome, found to be someone else’s css is not written standard: flex layout of justify-content: start; change to justify-content: flex-start; on it, no more problems

Modify as below:

[Solved] Found bindings for the following environments

When running the previously written vue project, I encountered the following error.
It should be caused by incompatible version upgrade
Error:

Module build failed: ModuleBuildError: Module build failed: Error: Missing binding E:\SVN\32IDPW\04-project\03-source\02-web\briefing\node_modules\node-sass\vendor\win32-x64-64\binding.node
Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 10.x
Found bindings for the following environments:
- Windows 64-bit with Node.js 8.x

 

Solution:

npm rebuild node-sass

npm update

npm run dev

[Solved] Syntax Error: Error: Node Sass does not yet support your current environment:

Error Messages:

 ERROR  Failed to compile with 1 error                                               AM11:47:18
error  in ./src/assets/styles/fat.scss
Syntax Error: Error: Node Sass does not yet support your current environment: Windows 64-bit withFor more information on which environments are supported please see:
https://github.com/sass/node-sass/releases/tag/v4.14.1

@ ./src/assets/styles/fat.scss 4:14-291 15:3-20:5 16:22-299
@ ./src/main.js
@ multi ./node_modules/[email protected]@webpack-dev-server/client?http://192.168.30.251:80&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

Solution:

 The node scss version does not match the current environment and needs to be uninstalled and reinstalled
Uninstall command: npm uninstall –save node-sass
Install command: npm install –save node-sass

[Solved] npm install sass@~1.32 sass-loader deepmerge -D Install Error

npm install sass@~1.32 sass-loader deepmerge -D install error:

PS E:\dome\automated-test-platform-vue2> npm install sass@~1.32 sass-loader deepmerge -D
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/webpack
npm ERR!   dev webpack@"^3.6.0" from the root project
npm ERR!
npm ERR! peer webpack@"^5.0.0" from [email protected]
npm ERR! node_modules/sass-loader
npm ERR!   dev sass-loader@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\shenyf\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\shenyf\AppData\Local\npm-cache\_logs\2022-01-13T03_11_17_119Z-debug.log

Solution:

PS E:\dome\automated-test-platform-vue2> npm install sass@~1.32 sass-loader@7 deepmerge -D

added 7 packages, and audited 1277 packages in 8s
63 packages are looking for funding
  run `npm fund` for details

86 vulnerabilities (2 low, 69 moderate, 15 high)

To address issues that do not require attention, run:
  npm audit fix

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.

[Solved] Node sass version 7.0.0 is incompatible with ^ 4.0.0 | ^ 5.0.0 | ^ 6.0.0

Today, when writing the Vue page, according to the tutorial, I want to install sass-loader and node-sass, but when running the project after installation, the following errors are reported:

Node Sass version 7.0.0 is incompatible with ^4.0.0 || ^5.0.0 || ^6.0.0

The solution is as follows

Stop using node-sass and replace it with sass.

If you want to use SCSS or sass in your application, you need to do this:

First uninstall the previously installed node-sass 

yarn remove node-sass

If NPM is used, then

npm uninstall node-sass

Then install sass instead of node-sass 

yarn add -D sass

perhaps

npm i -D sass

Then your SCSS/sass file will be compiled correctly.

[Solved] Error: EBUSY: resource busy or locked, lstat ‘D:\DumpStack.log.

Error: EBUSY: resource busy or locked, lstat ‘D:\DumpStack.log

If there is a SaaS like field in your vscade error report, one reason is that the version number does not match.

cnpm i -D [email protected] --save
cnpm i -D [email protected] --save

I won’t let go of the screenshot that reported an error. At that time, the error mentality collapsed. I may have forgotten the screenshot. I don’t want to make a similar error in the whole. I’m tired. (later found)

In a word, it is much faster to correct the version number first and then change it. The errors caused by other problems will be much faster.

I found the wrong screenshot of the * *

After the two commands are run, the following error reports are much kinder. It’s just that there is no dependency. The problem is not big. Just install it.


Done!

[Solved] Error: ENOSPC: System limit for number of file watchers reached

Project environment

Vue project

Cause of problem

The number of file monitoring is too large and the system limits it

Modify {etc/sysctl.d

 fs.inotify.max_user_watches = 524288

Apply changes

sudo sysctl -p --system

Docker inherits some setting files on the host. In order to prevent global impact, the above files will be set to read only in docker. Therefore, you need to change the above configuration on the host. After the host changes, docker automatically inherits.

Module not found: Error: Can‘t resolve ‘sass-loader‘ in…

sass-loader！

Failed to compile.

./src/main.js
Module not found: Error: Can't resolve 'sass-loader' in 'E:\study_software\JetBrains\WebStorm2021\WebstormProjects\vue-element-admin-master'


npm install sass-loader sass webpack --save-dev
npm install --save-dev node-sass
or
cnpm install node-sass --save

sass-loader: https://www.npmjs.com/package/sass-loader

Error: Node Sass does not yet support your current environment: Linux 64-bit with Unsupported runtim

Error: node sass does not yet support your current environment: Linux 64 bit with unsupported runtime (93)

It is taken for granted that the versions of node and node sass do not match.

It is useless to refer to various upgrades and demotions of the forum. mmp.

There’s really no way to install sass:

npm install sass

My project will automatically use sass. If you are worried or node sass is still working, you can also uninstall node sass:

npm uninstall node-sass

At this point, your project should run normally. Anyway, this is how I run packaging.

Reference articles:
https://zhuanlan.zhihu.com/p/405365755