jest-haste-map:Duplicate module name: react-animated - node.js

After adding react-native-push-notification and #react-native-community/push-notification-ios I am facing the error:
Error: jest-haste-map: Haste module naming collision:
Duplicate module name: react-animated
Paths: /<projectPath>/node_modules/#react-native-community/push-notification-ios/node_modules/react-native/Libraries/Animated/release/package.json collides with /<projectPath>/node_modules/react-native/Libraries/Animated/release/package.json
This error is caused by `hasteImpl` returning the same name for different files.
at setModule (/<projectPath>/node_modules/jest-haste-map/build/index.js:569:17)
at workerReply (/<projectPath>/node_modules/jest-haste-map/build/index.js:641:9)
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at async Promise.all (index 77)
I did add blacklist to rn-cli.config.js
cleared yarn cache, removed node_modules, cleared watchman and re-run
None helped.
"react": "16.8.3",
"react-native": "0.59.10",
"#react-native-community/push-notification-ios": "^1.2.0",
"react-native-push-notification": "^3.5.2",

I did add the blacklist to metro.config.js NOT rn-cli.config.js
// metro.config.js
var blacklist = require('metro-config/src/defaults/blacklist');
module.exports = {
resolver: {
blacklistRE: blacklist([
/node_modules\/.*\/node_modules\/react-native\/.*/,
])
},
};

Related

How to fix "can not fin'd bcrypt" in NestJS?

As found in this SO-answer, the following thing could be a way how to encrypt a password into a hash:
#BeforeInsert() async hashPassword() {
this.password = await bcrypt.hash(this.password, Number(process.env.HASH_SALT));
}
However, although I have installed "bcrypt" and "types/bcrypt", it can't get found by NodeJS:
src/entities/user.entity.ts:50:27 - error TS2552: Cannot find name
'bcrypt'. Did you mean 'crypto'?
In my package.json the following lines show that bcrypt was successfully installed:
"#types/bcrypt": "^5.0.0",
"bcrypt": "^5.0.1",
How to fix this?
Import the bcrypt on the files where you use it like this:
import * as bcrypt from 'bcrypt';

Cannot read property 'jquery' of undefined

I have a Rails 6 application with Webpacker. Node packages have been successfully installed with yarn.
The application works locally both in development and production modes with Puma server. But when calling the website on our virtual host, Phusion Passenger fails loading the Bootstrap 4 JavaScript part:
/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:21178
var e = i.default.fn.jquery.split(' ')[0].split('.');
^
TypeError: Cannot read property 'jquery' of undefined
at Object.jQueryDetection (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:21178:32)
at a (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:21183:9)
at Object.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:22435:56)
at n (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:8:17)
at Module.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:18176:7)
at Module.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:18179:7)
at n (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:8:17)
at /var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:26:98
at Object.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:27:2)
at Module._compile (internal/modules/cjs/loader.js:1085:14)
app/javascript/packs/application.js:
// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.
console.log('Webpacker: START application.js');
require('#rails/ujs').start();
require('turbolinks').start();
require('#rails/activestorage').start();
require('channels');
require('jquery');
// Uncomment to copy all static images under ../images to the output folder and reference
// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
// or the `imagePath` JavaScript helper below.
//
// const images = require.context('../images', true)
// const imagePath = (name) => images(name, true)
// #################### Proprietary configuration ####################
// JAVASCRIPT LIBRARIES
import 'popper.js';
import 'bootstrap';
import '#fortawesome/fontawesome-free';
// CSS OF USED LIBRARIES
import 'stylesheets/application';
// datetime picker
// load "moment" globally to avoid:
// "Error: Tempus Dominus Bootstrap4's requires moment.js. Moment.js must be included before Tempus Dominus Bootstrap4's JavaScript."
// See https://stackoverflow.com/questions/49580266/tempus-dominus-bootstrap4-requires-moment-js-datetime-picker
global.moment = require('moment');
require('moment/locale/de');
// If you require timezone data (see moment-timezone-rails for additional file options)
// import "moment-timezone-with-data"
require('tempusdominus-bootstrap-4');
console.log('Webpacker: END application.js');
config/webpack/environments.js (don't know what's correct here):
const { environment } = require('#rails/webpacker')
const webpack = require('webpack');
environment.plugins.prepend('Provide', // append
new webpack.ProvidePlugin({
$: 'jquery/src/jquery',
jQuery: 'jquery/src/jquery' // ,
// Popper: ['popper.js', 'defaults']
})
);
module.exports = environment
package.json:
{
"name": "myapp",
"private": true,
"dependencies": {
"#fortawesome/fontawesome-free": "^5.15.4",
"#popperjs/core": "^2.10.1",
"#rails/activestorage": "^6.1.4-1",
"#rails/ujs": "^6.1.4-1",
"#rails/webpacker": "5.4.3",
"bootstrap": "4.6.0",
"jquery": "^3.6.0",
"moment": "^2.29.1",
"moment-timezone": "^0.5.33",
"popper.js": "^1.16.1",
"tempusdominus-bootstrap-4": "^5.39.0",
"tempusdominus-core": "^5.19.0",
"turbolinks": "^5.2.0",
"webpack": "^4.46.0",
"webpack-cli": "^3.3.12"
},
"devDependencies": {
"webpack-dev-server": "^3"
}
}
When I use
if (typeof window !== "undefined") {
require('popper.js');
require('bootstrap');
require('#fortawesome/fontawesome-free');
}
like in Trying to import Bootstrap on Next.JS but says "TypeError: Cannot read property 'jquery' of undefined", I get another error:
/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:1785
return window.document;
^
ReferenceError: window is not defined
at Object.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:1785:7)
at Object.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:1786:7)
at n (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:8:17)
at Object.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:6524:10)
at n (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:8:17)
at Object.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:1682:110)
at Object.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:1772:8)
at n (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:8:17)
at Object.<anonymous> (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:1860:7)
at n (/var/www/vhosts/mydomain.com/httpdocs/myapp/public/packs/js/application-2432a12b5b63094eb637.js:8:17)
What am I missing?
Rails applications with Webpacker must not run as Node.js application additionally, although there are some Node packages used with Webpacker. They are only for client-side.
Phusion Passenger on the virtual host was configured not to load frequent application changes of all my numerous trial fixes. That's why the error didn't disappear when I tried the above solution weeks ago already ;-)
https://stackoverflow.com/questions/60198141/trying-to-import-bootstrap-on-next-js-but-says-typeerror-cannot-read-property was correct. Just had to wrap ALL Javascript library loads in application.js into condition:
if (typeof window !== "undefined")

Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './v4' is not defined by "exports"

I got this error when using uuidv4.
Failure: Package subpath './v4' is not defined by "exports" in C:\Users\mycomp\Desktop\Programming\Javascript\Serverless\Serverless Framework\node_modules\uuid\package.json
Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './v4' is not defined by "exports" in C:\Users\mycomp\Desktop\Programming\Javascript\Serverless\Serverless Framework\node_modules\uuid\package.json
I already installed uuid and require it in my code
const uuidv4 = require('uuid/v4');
Here's the package.json
"dependencies": {
"aws-sdk": "^2.702.0",
"moment": "^2.27.0",
"serverless-offline": "^6.4.0",
"underscore": "^1.10.2",
"uuid": "^8.1.0"
}
ECMAScript Module syntax:
import { v4 as uuidv4 } from 'uuid';
uuidv4(); // ⇨ '9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d'
CommonJS syntax:
const { v4: uuidv4 } = require('uuid');
uuidv4(); // ⇨ '1b9d6bcd-bbfd-4b2d-9b5d-ab8dfbbd4bed'
Another option
const uuid = require('uuid');
uuid.v4(); // "c438f870-f2b7-4b2c-a1c3-83bd88bb1d79"
We had the same error with v1 uuid module (v8.3.2).
Solved this, adding following entry to exports section of installed uuid package.json(inside your node_modules):
"./v1": "./dist/v1.js"
Full export section of my projects' node_modules/uuid/package.json:
"exports": {
".": {
"node": {
"module": "./dist/esm-node/index.js",
"require": "./dist/index.js",
"import": "./wrapper.mjs"
},
"default": "./dist/esm-browser/index.js"
},
"./package.json": "./package.json",
"./v1": "./dist/v1.js"
},
The problem remaining i now need to keep this modification across dist installs... :/
This could be fixed with a patch on uuid source itself?
EDIT: Didn't require the module in our own source. It is a dependency of jest (via some jest reporting sub-pkg).
EDIT: Alternatively, rolling back to uuid dep to v7.0.3 may fix this issue too, see comment below.
docs:
https://nodejs.org/api/esm.html
Like in CommonJS, module files within packages can be accessed by appending a path to the package name unless the package's package.json contains an "exports" field, in which case files within packages can only be accessed via the paths defined in "exports".
https://nodejs.org/api/packages.html#main-entry-point-export
When the "exports" field is defined, all subpaths of the package are encapsulated and no longer available to importers. For example, require('pkg/subpath.js') throws an ERR_PACKAGE_PATH_NOT_EXPORTED error.
This encapsulation of exports provides more reliable guarantees about package interfaces for tools and when handling semver upgrades for a package. It is not a strong encapsulation since a direct require of any absolute subpath of the package such as require('/path/to/node_modules/pkg/subpath.js') will still load subpath.js.

Running webpack throws 'Callback was already called' error

I just started learning webpack to manage dependencies in my project. I am trying to use it to build bundles for my typescript and javascript files. For the typescript files, I am using the ts-loader plugin for handling it. For CSS, I am using the mini-css-extract and an optimize-css-assets plugin. When I try to run webpack, I get the following error and I am not able to figure out what might be causing this error.
user#system spl % npm run build
> spl#1.0.0 build /Users/user/Downloads/spl
> webpack --config webpack.config.js
/Users/user/Downloads/spl/node_modules/neo-async/async.js:16
throw new Error('Callback was already called.');
^
Error: Callback was already called.
at throwError (/Users/user/Downloads/spl/node_modules/neo-async/async.js:16:11)
at /Users/user/Downloads/spl/node_modules/neo-async/async.js:2818:7
at processTicksAndRejections (internal/process/task_queues.js:79:11)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! spl#1.0.0 build: `webpack --config webpack.config.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the spl#1.0.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/user/.npm/_logs/2020-05-14T14_23_32_985Z-debug.log
The following is my webpack.config file that I am using to build my dist files.
const path = require('path');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const TerserPlugin = require('terser-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin");
module.exports = {
mode: 'production',
entry: "./static/js/index.js",
output: {
filename: "bundle.[contentHash].js", // File name with hash, based on content
path: path.resolve(__dirname, 'dist')
},
optimization: {
minimizer: [
new OptimizeCssAssetsPlugin(),
new TerserPlugin(),
new HtmlWebpackPlugin({
template: "./static/index.html",
minify: {
removeAttributeQuotes: true,
collapseWhitespace: true,
removeComments: true
}
})
]
},
plugins: [
new MiniCssExtractPlugin({
filename: "[name].[contentHash].css"
}),
new CleanWebpackPlugin(),
],
module: {
rules: [
{
test: /\.html$/,
use: [ "html-loader" ]
},
{
test: /\.[tj]s$/,
use: "ts-loader",
exclude: /(node_modules|tests)/
},
{
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader"
]
}
],
},
resolve: {
alias: {
src: path.resolve(__dirname, 'src'),
static: path.resolve(__dirname, 'static'),
},
extensions: [ '.ts', '.js' ]
}
}
I had the same issue and I realized that I was importing CSS file from my index.html file:
<link rel="stylesheet" href="./css/main.css">
although the CSS file should have been imported from entry file (index.js) using import:
import '../css/main.css';
so I deleted the line <link rel="stylesheet" href="./css/main.css"> and solved the problem.
You can see your HTML file and check if there are any assets imported from your HTML file. I hope it helped.
tl;dr: Upgrading webpack to a newer version solved it for me.
I went into node_modules/neo-async/async.js and modified the onlyOnce so that it gives a bit more descriptive stack trace like this:
/**
* #private
* #param {Function} func
*/
function onlyOnce(func) {
const defined = new Error('onlyOnce first used here')
return function(err, res) {
var fn = func;
func = () => {
console.error(defined);
throwError();
};
fn(err, res);
};
}
The stack trace points into webpack’s internal code, which, when I upgraded to the latest version, solves this issue.
I ran into this issue and was able to determine that the cause was circular dependencies in Typescript, not outdated dependencies as suggested by other answers here. This error appeared when I refactored code from import MyClass from "folder/file" into import { MyClass } from "folder".
I only considered this possibility after reading this post about differences in semantics between export default and other types of exports.
I had this issue and it was related to a recent downgrade someone had made to mini-css-extract-plugin. We are using pnpm, so this answer is specific to that. I had to delete the pnpm-lock.yaml file in the module I was trying to run out of spring boot dashboard in VSCode. This file is generated if it is missing, but for us anyway, it was committed to the repo. If that doesn't work for you, you might also consider deleting the npm-cache and .pnpm-store dirs. The locations of those files are configured in the .npmrc file in your user's home directory.
For me, the issue came after upgrading css-loader. Downgrading it back to the original version did the trick for me
diff --git a/package.json b/package.json
index 7151c509..b0eba48b 100644
--- a/package.json
+++ b/package.json
## -111,7 +111,7 ##
"webpack-merge": "^4.1.3"
},
"devDependencies": {
- "css-loader": "^6.5.1",
+ "css-loader": "^1.0.0",

Arguments to path.resolve must be strings when running Grunt

My Grunt file:
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
ts: {
dev: {
src: ["src/background/*.ts"],
out: ["build/background.js"],
}
}
});
grunt.loadNpmTasks("grunt-ts");
grunt.registerTask("default", ["ts:dev"]);
};
(I am using grunt-ts.)
System info
Windows 8.1
NodeJS v0.10.24
grunt-cli v0.1.11
grunt v0.4.2
I've already searched the Internet and found many resources about this error, but they all say that one should upgrade NodeJS and/or Grunt. I've already tried that. I had even completely re-installed Grunt, however, the error remained.
The complete error message:
P:\my-folder>grunt ts
Running "ts:dev" (ts) task
Warning: Arguments to path.resolve must be strings Use --force to continue
Aborted due to warnings.
package.json
{
"name": "regex-search",
"version": "0.1.0",
"devDependencies": {
"grunt": "~0.4.2",
"grunt-contrib-jshint": "~0.6.3",
"grunt-contrib-nodeunit": "~0.2.0",
"grunt-contrib-uglify": "~0.2.2",
"grunt-ts": "~1.5.1"
}
}
After comparing my Gruntfile with the officially provided sample file, I found my really silly mistake:
ts: {
dev: {
src: ["src/background/*.ts"],
out: ["build/background.js"],
}
}
out must not be an array!
The correct version:
ts: {
dev: {
src: ["src/background/*.ts"],
out: "build/background.js",
}
}
So in my particular case, a node module's main attribute in package.json was an array and not a string, example in history.js' package.json:
{
"main": [ './history.js', './history.adapter.ender.js' ]
}
The way I found this out was going to where the error originated in my node_modules and then did console.log(pkg.main) right above it.
Original stacktrace:
Fatal error: Arguments to path.resolve must be strings
TypeError: Arguments to path.resolve must be strings
at Object.posix.resolve (path.js:422:13)
at /Users/ebower/work/renvy/node_modules/browserify/node_modules/resolve/lib/async.js:153:38
at fs.js:336:14
at /Users/ebower/work/renvy/node_modules/grunt-browserify/node_modules/watchify/node_modules/chokidar/node_modules/readdirp/node_modules/graceful-fs/graceful-fs.js:104:5
at /Users/ebower/work/renvy/node_modules/grunt-mocha/node_modules/mocha/node_modules/glob/node_modules/graceful-fs/graceful-fs.js:104:5
at FSReqWrap.oncomplete (fs.js:99:15)

Resources