Why do I get errors when importing tfjs-node? - vuejs2

import * as tfn from '#tensorflow/tfjs-node
throws me followed warnings:
WARNING Compiled with 4 warnings 15:06:46
warning in ./node_modules/#tensorflow/tfjs-node/dist/index.js
Critical dependency: the request of a dependency is an expression
warning in ./node_modules/#mapbox/node-pre-gyp/lib/util/compile.js
Module not found: Error: Can't resolve 'node-gyp' in 'C:\Users\Username\Desktop\Team\my-app\node_modules\#mapbox\node-pre-gyp\lib\util'
warning in ./node_modules/#mapbox/node-pre-gyp/lib/util/compile.js
Module not found: Error: Can't resolve 'npm' in 'C:\Users\Username\Desktop\Team\my-app\node_modules\#mapbox\node-pre-gyp\lib\util'
warning in ./node_modules/#mapbox/node-pre-gyp/lib/util/nw-pre-gyp/index.html
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
> <!doctype html>
Why is that? (vue: 2.7.8)
Webpack.config.js:
const path = require('path');
const nodeExternals = require('webpack-node-externals');
module.exports = {
entry: './server.js',
mode: 'production',
target: 'node',
externals: [nodeExternals()],
output: {
path: path.resolve(__dirname, '.'),
filename: 'server.bundle.js'
}
};
Package versions:
├── #tensorflow/tfjs-converter#3.19.0
├── #tensorflow/tfjs-core#3.19.0
├── #tensorflow/tfjs-node#3.19.0
├── #tensorflow/tfjs#3.19.0
├── aws-sdk#2.1195.0
(Please let me know if you need information for further details)
Also tried a workaround with Windows Subsystem for Linux which gives me followed error:
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! #tensorflow/tfjs-node#3.19.0 install: `node scripts/install.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the #tensorflow/tfjs-node#3.19.0 install script.

Based on your error, it's likely that you are using Python 3. According to the documentation, "Windows & OSX build support for node-gyp requires Python 2.7". In the event that you are using the correct version of Python, see the Windows troubleshooting guide for further troubleshooting information.
Conversely, you can use Windows Subsystem for Linux, and then interact with TensorFlow.js through Linux. My colleague on the team who uses Windows prefers this method, so I'd recommend it.

Related

Error received when initializing a ViteJS app

When I run the command below in Gitbash:
$ npm init #vitejs/app
I recevice the following error:
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
#vitejs/create-app is deprecated, use npm init vite instead
C:\Users\me\AppData\Local\npm-cache\_npx\9c7583f20b80c4d1\node_modules\#vitejs\create-app\index.js:43
require('create-vite')
^
Error [ERR_REQUIRE_ESM]: require() of ES Module C:\Users\me\AppData\Local\npm-cache\_npx\9c7583f20b80c4d1\node_modules\create-vite\index.js from C:\Users\me\AppData\Local\npm-cache\_npx\9c7583f20b80c4d1\node_modules\#vitejs\create-app\index.js not supported.
C:\Users\me\AppData\Local\npm-cache\_npx\9c7583f20b80c4d1\node_modules\create-vite\index.js is treated as an ES module file as it is a .js
file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.
Instead rename C:\Users\me\AppData\Local\npm-cache\_npx\9c7583f20b80c4d1\node_modules\create-vite\index.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in C:\Users\me\AppData\Local\npm-cache\_npx\9c7583f20b80c4d1\node_modules\create-vite\package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).
at Object.<anonymous> (C:\Users\me\AppData\Local\npm-cache\_npx\9c7583f20b80c4d1\node_modules\#vitejs\create-app\index.js:43:1) {
code: 'ERR_REQUIRE_ESM'
}
npm ERR! code 1
npm ERR! path C:\Users\me\Desktop
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c C:\Users\me\AppData\Local\Temp\npx-ee21ed07.cmd
Could anyone please help me?
Try this instead:
$npm create vite#latest
Further Documentation
GitHub Related Issue
Worked for me. I follow a website tutorial online (https://www.youtube.com/watch?v=Q7AOvWpIVHU).
I got stuck at step 1.
vscode/app> npm init #vitejs/app
I used vscode/app>npm create vite#latest
Now I can continue, don't know if I will be able to complete the entire tutorial, but for now, it fixes the problem.
If you recommend another way to make an website with 3D content, let me know.

Vue.js: Error after configuring Router.js. Vue/types/umd. chokidar (C drive error)

I was running a dev server after changing my router.js file. Adding a webpage .vue file to the configuration. After doing so it failed to compile with only one errors. This is the output:
This dependency was not found:
* vue/types/umd in ./src/router.js
To install it, you can run: npm install --save vue/types/umd
Error from chokidar (C:\): Error: EBUSY: resource busy or locked, lstat 'C:\hiberfil.sys'
Error from chokidar (C:\): Error: EBUSY: resource busy or locked, lstat 'C:\swapfile.sys'
I tried the advice, and installed vue/types/umd and it still compiled with an error. I then uploaded my project to GitLab. Deleted the project on my Documents folder then downloaded it again. Used npm install then the typical npm run serve and still the same error.
Check if by accident this kind of import didn't appear in your file ./src/router.js. I had this error when this line appeared in my file. Probably I pressed some key when wanted to use nextTick. In your case it could be attempt to import router. So when I removed this import line everything went back to normal.
import { nextTick } from 'vue/types/umd';
npm install --save vue/types/umd
npm ERR! code ENOLOCAL
npm ERR! Could not install from "vue/types/umd" as it does not contain a package.json file.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/lenovo/.npm/_logs/2022-05-16T17_40_02_280Z-debug.log

Error when trying to start Slate: WebpackOptionsValidationError

Recently I've set up Slate using these steps to work on my Shopify themes locally. It worked fine, but after a while i got an error when attempting to npm start Slate in the terminal.
I've tried updating npm and node and they are both the latest version.
This is the error I get in the terminal:
starter-theme#1.0.0-alpha.1 start path-to-project
slate-tools start
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.entry should be an non-empty object.
-> Multiple entry bundles are created. The key is the chunk name. The value can be a string or an array.
at webpack (path-to-project-folder/node_modules/webpack/lib/webpack.js:31:9)
at new DevServer (path-to-project-folder/node_modules/#shopify/slate-tools/tools/asset-server/index.js:21:21)
at path-to-project-folder/node_modules/#shopify/slate-tools/cli/commands/start.js:48:19
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! starter-theme#1.0.0-alpha.1 start: `slate-tools start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the starter-theme#1.0.0-alpha.1 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
This is the slate.config.js file:
/* eslint-disable */
// Configuration file for all things Slate.
// For more information, visit https://github.com/Shopify/slate/wiki/Slate-Configuration
const path = require('path');
module.exports = {
'cssVarLoader.liquidPath': ['src/snippets/css-variables.liquid'],
'webpack.extend': {
resolve: {
alias: {
jquery: path.resolve('./node_modules/jquery'),
'lodash-es': path.resolve('./node_modules/lodash-es'),
},
},
},
};
Has anyone run into this issue before, how did you fix it?

How to fix "Error: Watching remote files is not supported" problem in Visual Studio Code

I have Vue application that I don't run for a while and now I cannot start development server?! In meanwhile something updated and that don't work. I tried new clean vue/vuetify install and same problem!
Build for production works normally, only run development server don't work.
And important notice: when run "npm run serve" in command prompt (outside VS Code), it works normally. That not work only in VS Code Terminal. What is problem?
Node version is v10.16.0
Npm version is 6.10.3
VS Code About:
Commit: 036a6b1d3ac84e5ca96a17a44e63a87971f8fcc8
Date: 2019-08-08T02:33:50.993Z
Electron: 4.2.7
Chrome: 69.0.3497.128
Node.js: 10.11.0
V8: 6.9.427.31-electron.0
OS: Windows_NT x64 10.0.17763
Error (from terminal window):
> Executing task: npm run serve <
> portal#0.1.0 serve d:\Wamp64\www\portal
> vue-cli-service serve
INFO Starting development server...
10% building 2/2 modules 0 active ERROR Error: Watching remote files is not supported.
Error: Watching remote files is not supported.
at Server.setupWatchStaticFeature (d:\Wamp64\www\portal\node_modules\webpack-dev-server\lib\Server.js:405:13)
at Object.watchContentBase (d:\Wamp64\www\portal\node_modules\webpack-dev-server\lib\Server.js:477:14)
at forEach (d:\Wamp64\www\portal\node_modules\webpack-dev-server\lib\Server.js:550:24)
at Array.forEach (<anonymous>)
at Server.setupFeatures (d:\Wamp64\www\portal\node_modules\webpack-dev-server\lib\Server.js:549:49)
at new Server (d:\Wamp64\www\portal\node_modules\webpack-dev-server\lib\Server.js:125:10)
at serve (d:\Wamp64\www\portal\node_modules\#vue\cli-service\lib\commands\serve.js:139:20)
at process._tickCallback (internal/process/next_tick.js:68:7)
at Function.Module.runMain (internal/modules/cjs/loader.js:832:11)
at startup (internal/bootstrap/node.js:283:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! portal#0.1.0 serve: `vue-cli-service serve`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the portal#0.1.0 serve 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\Sasa Gosovic\AppData\Roaming\npm-cache\_logs\2019-08-11T10_35_40_418Z-debug.log
The terminal process terminated with exit code: 1
Press any key to close the terminal.
Exactly the same issue here. I resolved it by rolling back the version of webpack-dev-server.
npm install webpack-dev-server#3.7.2 --save-dev
Looks like the setupWatchStaticFeature function has changed between 3.7.2 and 3.8.0 which is triggering the issue.
You can eddit the vue.config.js file, adding following code:
devServer: {
contentBase: './public'
}
More details: https://github.com/webpack/webpack-dev-server/issues/2190#issuecomment-520670599
Until the issue is open, a workaround could be to use Git Bash instead of Windows command line to run npm run serve. I modified Server.js to output the contentBase variable. When using Windows command line or Vue UI, the variable contained "c:\...". Using Git Bash on my Windows 10 machine it contains "C:\..." and it worked.

Gulp, postcss and UnCSS

I'm trying to clean up my css and use UnCSS with gulp and Postcss.
I have this:
gulp.task('optim-css', function() {
var stream1 = gulp.src(['dev/css/bootstrap.min.css','dev/css/custom.css'])
.pipe(postcss([ rucksack() ]))
.pipe(postcss(uncss({
html: ['http://localhost/olssonseder/','http://localhost/olssonseder/lyssna/','http://localhost/olssonseder/repertoar/','http://localhost/olssonseder/kontakta/','http://localhost/olssonseder/kontakta/','http://localhost/olssonseder/om-gitarren/'],
ignore: [new RegExp('.b-lazy*'),
new RegExp('.stickyFooter')]
}))
);
var stream2 = gulp.src(['dev/css/responsive-nav.css','dev/css/lity.css','dev/css/mp3-player-button.css'])
return merge(stream1, stream2)
.pipe(concat('styles.css'))
.pipe(cleanCSS())
.pipe(gulp.dest(''))
.pipe(browserSync.stream());
});
But I get this error and I just can't figure out why:
[14:21:49] TypeError: UnCSS: expected a callback
at init (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\uncss\src\uncss.js:176:15)
at Gulp.<anonymous> (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\gulpfile.js:48:23)
at module.exports (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\orchestrator\lib\runTask.js:34:7)
at Gulp.Orchestrator._runTask (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\orchestrator\index.js:273:3)
at Gulp.Orchestrator._runStep (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\orchestrator\index.js:214:10)
at Gulp.Orchestrator.start (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\orchestrator\index.js:134:8)
at C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\gulp\bin\gulp.js:129:20
at process._tickCallback (internal/process/next_tick.js:150:11)
at Function.Module.runMain (module.js:703:11)
at startup (bootstrap_node.js:190:16)
[14:21:52] Finished 'optim-js' after 2.75 s
[14:21:52] Finished 'optim-deferjs' after 2.73 s
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! bastema#1.0.0 gi: `gulp init`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the bastema#1.0.0 gi 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\Nicke\AppData\Roaming\npm-cache\_logs\2018-07-27T12_21_52_508Z-debug.log
Anyone has an idea as to why this is happening?
I ran into the same problem. After creating a callback and running into other problems, I found that uncss could not be used directly with postcss. Use postcss-uncss instead and it works as expected.
From: https://github.com/uncss/uncss
Note: Depending on your environment, you might not be able to use
uncss as a PostCSS plugin since the plugin is not directly exported.
In such cases, use the wrapper library postcss-uncss.
Here is the postcss-uncss library: https://github.com/uncss/postcss-uncss