"Can't resolve 'fs'" on Next.js using google-cloud/kms - google-cloud-platform

The titled error happened in my environment.
I want to know how to resolve this error.
Surely I installed 'fs'.
My program is below. Just a simple, but an error has happened.
import {KeyManagementServiceClient} from '#google-cloud/kms';
const client = new KeyManagementServiceClient();
export default function Home() {
return (
<>
</>
)
}
And then, an error message is here.
./node_modules/gcp-metadata/build/src/gcp-residency.js:19:0
Module not found: Can't resolve 'fs'
Import trace for requested module:
./node_modules/gcp-metadata/build/src/index.js
./node_modules/google-auth-library/build/src/auth/googleauth.js
./node_modules/google-auth-library/build/src/index.js
./node_modules/google-gax/build/src/fallback.js
./node_modules/#google-cloud/kms/build/src/v1/ekm_service_client.js
./node_modules/#google-cloud/kms/build/src/v1/index.js
./node_modules/#google-cloud/kms/build/src/index.js
./src/pages/gcp.tsx
https://nextjs.org/docs/messages/module-not-found
Versions
"#google-cloud/kms": "^3.3.0",
"#next/font": "13.1.6",
"#types/node": "18.11.18",
"#types/react": "18.0.27",
"#types/react-dom": "18.0.10",
"next": "13.1.6",
"react": "18.2.0",
"react-dom": "18.2.0",
"typescript": "4.9.5
Please help me, someone.

As 'fs' is built-in module of Node.js, so probably that may help you:
https://nextjs.org/docs/messages/module-not-found#the-module-youre-trying-to-import-uses-nodejs-specific-modules
In Next.js we can not import node specific modules inside separate component, only on pages level.

Related

Issue integrating cypress-angular-unit-test into Cypress plugins

I am attempting to add the cypress-angular-unit-test plugin to Cypress.
However, following the instructions provided on the related GitHub page I am getting the following error:
The plugins file is missing or invalid.
/MyProjectName/cypress/plugins/index.js:1
import * as cypressTypeScriptPreprocessor from 'cy-ts-preprocessor';
^^^^^^
SyntaxError: Cannot use import statement outside a module
Again, as instructed, I have added the following to support/index.js
// core-js 3.*
require('core-js/es/reflect');
// core-js 2.*
require('core-js/es7/reflect');
require('cypress-angular-unit-test/support');
And the following to plugins/index.js
import * as cypressTypeScriptPreprocessor from 'cy-ts-preprocessor';
module.exports = (on, config) => {
on('file:preprocessor', cypressTypeScriptPreprocessor);
require('#cypress/code-coverage/task')(on, config);
return config;
};
I've also added the related helper.js and cy-ts-preprocessor.js file to the plugins folder.
I've also added the necessary config to cypress.json
"experimentalComponentTesting": true,
I've even tried adding types/node by adding a tsconfig.json to the cypress folder like so:
{
"compilerOptions": {
"target": "es5",
"lib": ["es5", "dom"],
"types": ["cypress", "node"],
"experimentalDecorators": true
},
"include": [
"**/*.ts"
]
}
Changing the target and/or lib values to es6 has no effect.
Changing the import to a require yields a different error which, even if it did work, seems like a hacky solution for some detail I am missing.
¯\_(ツ)_/¯
Not exactly an answer but at least a work around.
Start fresh or uninstall Cypress and cypress-angular-unit-test
Follow the instructions for Nx Cypress install found on here
Go back to cypress-angular-unit-test instructions and ignore this part:
Configure cypress/plugins/index.js to transpile Angular code.
import * as cypressTypeScriptPreprocessor from './cy-ts-preprocessor';
module.exports = (on, config) => {
on('file:preprocessor', cypressTypeScriptPreprocessor);
return config;
};
The file cy-ts-preprocessor is here

Worker from imported NPM module causing jest tests to fail

I installed browser-image-compression which, as part of its functionality, creates a Worker. Now when I run jest tests, I get the following error:
Test suite failed to run
ReferenceError: Worker is not defined
There are no tests connected to the function which uses browser-image-compression.
The scripts section in package.json has the following two lines
"test": "react-scripts test",
"test:ci": "cross-env CI=true react-scripts test"
Oh, and I have a file for setting up tests. Should I mock Worker in here?
import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import '#domain/yup';
configure({
adapter: new Adapter()
});
global.fetch = require('jest-fetch-mock');
Late in responding to this but it could help others - but following this comment helped me with this issue.
If you add the following to its own file - I have mine within the same dir as the setupTests file named workerMock.js:
export default class Worker {
constructor(stringUrl) {
this.url = stringUrl;
this.onmessage = () => {};
}
postMessage(msg) {
this.onmessage(msg);
}
}
Then import that Worker file into your test setup file and add window.Worker = Worker. Your setup file may look like:
import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import '#domain/yup';
import Worker from 'path-to-your-worker-file-above';
configure({
adapter: new Adapter()
});
global.fetch = require('jest-fetch-mock');
window.Worker = Worker;
Hope this helps
A better solution is that updating 'browser-image-compression' package to the latest version , this helped me .

How to use a bucklescript library with rtop in an esy project?

I am attempting to use rtop as repl on an esy project.
In order to do so, I have added "#esy-ocaml/rtop":"*" to the devDependencies section of my package.json file, and tried to start rtop with esy rtop:
{
...,
"dependencies": {
"react": "^16.2.0",
"react-dom": "^16.2.0",
"reason-react": ">=0.4.0"
},
"devDependencies": {
"bs-platform": "^4.0.14",
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.0.1",
"webpack-cli": "^3.1.1",
"webpack-dev-server": "^3.1.8",
"#esy-ocaml/rtop":"*"
}
}
however, I am unable to load my components:
→ esy rtop
Reason # #use "./src/Component1.re";
File "./src/Component1.re", line 2, characters 5-16:
Error: Unbound module ReasonReact
Reason # #require "reason-react";
No such package: reason-react
Reason # #require "react";
Reason #
but, as you can see I am able to load React, whatever that means...
Well, how can I use rtop as my project repl?
I have also asked this in reasonml.chat and the answer was as follows
Esy doesn’t magically make bs-platform works with native toolings.
rtop is exclusively for native only and can’t be use in a bucklescript project

Vue vue-sweetalert2 . error in test:unit with Jest

As per the vue-sweetalert2 doc, in my main.js, I import and use the plugin:
import VueSweetalert2 from "vue-sweetalert2";
Vue.use(VueSweetalert2);
In my component, ContactForm.vue, I can use:
this.$swal(...)
However, when I test:unit this component, I need to add the import and Vue.use()
import VueSweetalert2 from "vue-sweetalert2";
Vue.use(VueSweetalert2);
and I get an error:
$ vue-cli-service test:unit ContactForm.spec.js
FAIL tests/unit/ContactForm.spec.js
● Test suite failed to run
Jest encountered an unexpected token
This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
Here's what you can do:
• To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
• If you need a custom transformation specify a "transform" option in your config.
• If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html
Details:
/Users/yves/Developments/WIP/VUE.JS-cli-3/3-chocha-home-content/chocha/node_modules/vue-sweetalert2/src/index.js:2
import swal from 'sweetalert2/dist/sweetalert2.min.js';
^^^^^^
SyntaxError: Unexpected token import
What could be wrong?
UPDATE
the vue-sweetalert2/src/index.js, line 2 faulty line, is:
// #ts-check
import swal from 'sweetalert2/dist/sweetalert2.min.js';
the developer of this wrapper added an index.d.ts fie
import Vue, { PluginObject, PluginFunction } from 'vue';
import * as swal from 'sweetalert2';
...
but it seems not to be taken in account.
SOLVED ...
I added a transformIgnorePatterns in my jest config in package.json
"jest": {
....
"transformIgnorePatterns": [
"/node_modules/(?!vue-sweetalert2).+\\.js$"
],
....
}

Setting up django-mssql issues

I'm having some issues setting up django-mssql on Win Server 2008 R2. I have everything installed, however, the wiki for django-mssql says to setup the settings file similar to:
DATABASES = {
'default': {
'NAME': 'my_database',
'ENGINE': 'sqlserver_ado',
'HOST': 'dbserver\\ss2008',
'USER': '',
'PASSWORD': '',
'OPTIONS' : {
'provider': 'SQLOLEDB',
'use_mars': True,
},
}
}
When I run from my site directory:
python manage.py syncdb
I get an error stating it isn't an available database backend. When I installed django-mssql it seemed to install the backend here \site-packages\django_mssql-1.0.1-py2.7.egg\sqlserver_ado does this need to be copied to site-packages\django\db\backends?
I get the same error if I set my settings to:
DATABASES = {
'default': {
'NAME': 'my_database',
'ENGINE': 'django_mssql-1.0.1-py2.7.egg.sqlserver_ado',
'HOST': 'dbserver\\ss2008',
'USER': '',
'PASSWORD': '',
'OPTIONS' : {
'provider': 'SQLOLEDB',
'use_mars': True,
},
}
}
Am I missing something when setting up this backend? This is my first time using django, but I didn't see anything in the documentation for setting up a different backend, and the django-mssql wiki or issues doesn't seem to have anything either.
Also, if there is other documentation somewhere that can help please let me know.
EDIT: The django app is running on Ubuntu server.
Dustin's comment about making sure "import sqlserver_ado" from the command shell got me going down the right path on my Django 1.8.1, Python 3.5 Win32 system with pywin32 installed.
SPOILER ALERT This only gets my Django instance to run without errors. I haven't tested the ADO connection yet.
The first error message I got was:
No module named 'django.db.backends.util'
and I found there is a file called: django.db.backends.utils so I copied it and renamed it to django.db.backends.util (without the 's') and away went the error message!
So hoping this wasn't too harmful, I continued on this line of troubleshooting.
The next error message I got was:
File "C:\Program Files (x86)\Python35-32\lib\site-packages\sqlserver_ado\base.py", line 7, in <module>
from django.db.backends import BaseDatabaseWrapper, BaseDatabaseFeatures, BaseDatabaseValidation, BaseDatabaseClient
ImportError: cannot import name 'BaseDatabaseWrapper'
I changed line 7 in base.py to now say:
#from django.db.backends import BaseDatabaseWrapper, BaseDatabaseFeatures, BaseDatabaseValidation, BaseDatabaseClient
from django.db.backends.base.base import BaseDatabaseWrapper
from django.db.backends.base.features import BaseDatabaseFeatures
from django.db.backends.base.validation import BaseDatabaseValidation
from django.db.backends.base.client import BaseDatabaseClient
Yes, that's commenting out the bad line and adding four separate lines.
Then I got this error:
File "C:\Program Files (x86)\Python35-32\lib\site-packages\sqlserver_ado\base.py", line 18, in <module>
from .introspection import DatabaseIntrospection
File "C:\Program Files (x86)\Python35-32\lib\site-packages\sqlserver_ado\introspection.py", line 3, in
from django.db.backends import BaseDatabaseIntrospection
ImportError: cannot import name 'BaseDatabaseIntrospection'
so I changed the line 3 to now read:
from django.db.backends.base.introspection import BaseDatabaseIntrospection
and so on for creation.py:
from django.db.backends.base.creation import BaseDatabaseCreation
for operations.py:
from django.db.backends.base.operations import BaseDatabaseOperations
for schema.py:
from django.utils.log import getLogger
Hope this helps someone. Hope the ADO module actually connects to something.
-Sean
You will want to make sure that you can import "sqlserver_ado" from your python shell.
Put the folder sqlserver_ado somewhere on your PATH, I put mine in \site-packages\
Take a look at the README.txt.
The engine does want to be set to "sqlserver_ado" similar to how the settings are done on the settings sample page.
As of 2019:
I couldn't get Django MSSQL to work at all.
I switched over to django-pyodbc-azure and that works great.
Install:
pip install django-pyodbc-azure
Setup:
'ENGINE': 'sql_server.pyodbc'
You need to install the dependency PyWin32. You can install via pip or download from the python binaries page http://www.lfd.uci.edu/~gohlke/pythonlibs/
I was trying to get django_pyodbc to work, and couldn't. I was getting this error:
django.core.exceptions.ImproperlyConfigured: 'django_pyodbc' isn't an available database backend.
Try using 'django.db.backends.XXX', where XXX is one of:
u'base', u'mysql', u'oracle', u'postgresql_psycopg2', u'sqlite3'
Error was: cannot import name BaseDatabaseWrapper
I was directed to this post as a solution, so I'll post my answer here also.
I downgraded to django 1.6 instead of 1.8, and now django_pyodbc works as a database backend.
As per https://github.com/lionheart/django-pyodbc/pull/96, django_pyodbc should now work with Django 1.8. So this seems to be a good alternative to django-mssql for those requiring SQL Server 2008 R2 support.