Turning on the 'esModuleInterop' flag - firebase

I'm using Firebase Functions for my App. I installed these firebase functions on my PC but I can't use the following command:
Firebase deploy --only functions
I get the following error:
node_modules/google-gax/build/protos/iam_service.d.ts:17:23 - error TS2497: This module
can only be referenced with ECMAScript imports/exports by turning on the
'esModuleInterop' flag and referencing its default export.
17 import * as Long from 'long';
~~~~~~
node_modules/google-gax/build/protos/operations.d.ts:17:23 - error TS2497: This module
can only be referenced with ECMAScript imports/exports by turning on the
'esModuleInterop' flag and referencing its default export.
17 import * as Long from 'long';
~~~~~~
Found 2 errors in 2 files.
Errors Files
1 node_modules/google-gax/build/protos/iam_service.d.ts:17
1 node_modules/google-gax/build/protos/operations.d.ts:17
Error: functions predeploy error: Command terminated with non-zero exit code2
Does anyone know how to turn on this flag?

just add "skipLibCheck": true to your tsconfig.json as shown below:
"compilerOptions": {
"module": "commonjs",
"noImplicitReturns": true,
"noUnusedLocals": true,
"outDir": "lib",
"sourceMap": true,
"strict": true,
"target": "es2017",
"skipLibCheck": true
},

Related

Error: Failed to load config "next" to extend from

I have a Nextjs app using jest and react-testing-library for the test, I add the .eslintrc file with npx .eslintrc --init command to my project.
whenever I lint my project, I get the following error:
.eslintrc.js:
module.exports = {
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"plugin:#typescript-eslint/recommended",
"plugin:#typescript-eslint/recommended-requiring-type-checking",
"next",
"next/core-web-vitals"
],
"parser": "#typescript-eslint/parser",
"parserOptions": {
"project":"./tsconfig.json",
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 12,
"sourceType": "module"
},
"rules": {
}
};
and error:
info - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
Error: Failed to load config "next" to extend from.
Referenced from: D:\web\reactjs\react-testing\react-testing-app\.eslintrc.js
Resolved, after installing this package, the code will run without error:
npm i --save-dev eslint-config-next
For a misterious reason running npm audit fix --force changed my package.json from:
"eslint-config-next": "12.0.1"
to:
"eslint-config-next": "^0.2.4"
I had to change it manually and the error went away.

Module '"tapable"' has no exported member 'Tapable'

I was working on a WordPress plugin for a custom Gutenberg block.
Since I needed to add additional scripts which I wanted to write in TypeScript, I used "$ tsc --watch" and a "tsconfig.json"-file to compile them.
After installing #wordpress/scripts ("$ npm i --save-dev --save-exact #wordpress/scripts"), tsc indicated 89 errors at this path: node_modules#types\webpack\index.d.ts.
I have opened this file and found that the source of all the errors was the first line of this import statement:
import {
Tapable,
HookMap,
SyncBailHook,
SyncHook,
SyncLoopHook,
SyncWaterfallHook,
AsyncParallelBailHook,
AsyncParallelHook,
AsyncSeriesBailHook,
AsyncSeriesHook,
AsyncSeriesWaterfallHook,
} from 'tapable';
Tsc was still working for my files, but having 89 errors thrown each time I compile is concerning nonetheless.
This is the code of my tsconfig.json:
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"allowUnreachableCode": false,
"declaration": false,
"resolveJsonModule": true,
"experimentalDecorators": true,
"lib": [
"dom",
"es2017"
],
"moduleResolution": "node",
"module": "esnext",
"target": "es2017",
"outDir": "script/build",
"noUnusedLocals": true,
"noUnusedParameters": true,
"jsx": "react",
"jsxFactory": "h"
},
"include": [
"script/src"
],
"exclude": [
"node_modules"
]
}
I found that the problem was the path of the import statement.
Webpack was importing Tapable from node_modules/tapable when it would have needed to import it from node_modules/#types/tapable.
Changing the last line of the import statement fixed all errors:
} from '../tapable';

How to compile 2 less files in 2 !!! css file in a specific place?

The initial layout in less. It is necessary to make, that media requests were disconnected -> the basic styles we take out in app.less, media - in media.less. Now you have to compile 2 css files from them and put them in a certain place.
For a basis took [https://github.com/vikpe/react-webpack-babel-starter] here this pig. Here webpack 3, more or less a fresh reagent and so on.
I put less-loader, I prescribe in common.js
{
test: /\.less$/,
use: [{
loader: "style-loader" // creates style nodes from JS strings
}, {
loader: "css-loader" // translates CSS into CommonJS
}, {
loader: "less-loader" // compiles Less to CSS
}],
},
in the react-component I import: import 'assets / less / app.less'; and import 'assets / less / media.less';
All works, but less was not recompiled in a css-file and it was built in html. Not the same. Next, the option for selling is indicated in the docks (Typically, it is recommended that you extract the style sheets to a separate file created with ExtractTextPlugin, so your styles do not depend on JavaScript.) I change the prod.js to
// production config
const merge = require('webpack-merge');
const {resolve} = require('path');
const commonConfig = require('./common');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const extractLess = new ExtractTextPlugin({
filename: "[name].[contenthash].css",
disable: process.env.NODE_ENV === "development"
});
module.exports = merge(commonConfig, {
entry: './index.js',
devtool: 'source-map',
output: {
filename: 'js/bundle.[hash].min.js',
path: resolve(__dirname, '../../dist'),
publicPath: '/',
},
module: {
rules: [{
test: /\.less$/,
use: extractLess.extract({
use: [{
loader: "css-loader"
}, {
loader: "less-loader"
}],
// use style-loader in development
fallback: "style-loader",
publicPath:"/css/"
})
}]
},
plugins: [
extractLess
]
});
I start npm run start-prod and as a result:
1. All styles are written in one css file (and I need it in 2), and not the one where I pointed in publicPath.
2. In the npm-debug.log errors
0 info it worked if it ends with ok
1 verbose cli [ 'D:\\nodejs\\node.exe',
1 verbose cli 'D:\\nodejs\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'start-prod' ]
2 info using npm#4.0.5
3 info using node#v7.4.0
4 verbose run-script [ 'prestart-prod', 'start-prod', 'poststart-prod' ]
5 info lifecycle react-webpack-babel-starter#0.1.0~prestart-prod: react-webpack-babel-starter#0.1.0
6 silly lifecycle react-webpack-babel-starter#0.1.0~prestart-prod: no script for prestart-prod, continuing
7 info lifecycle react-webpack-babel-starter#0.1.0~start-prod: react-webpack-babel-starter#0.1.0
8 verbose lifecycle react-webpack-babel-starter#0.1.0~start-prod: unsafe-perm in lifecycle true
9 verbose lifecycle react-webpack-babel-starter#0.1.0~start-prod: PATH: D:\nodejs\node_modules\npm\bin\node-gyp-bin;F:\react-webpack-babel-starter-master-less\node_modules\.bin;C:\Users\daima\bin;D:\Git\mingw64\bin;D:\Git\usr\local\bin;D:\Git\usr\bin;D:\Git\usr\bin;D:\Git\mingw64\bin;D:\Git\usr\bin;C:\Users\daima\bin;C:\Program Files (x86)\Common Files\Intel\Shared Files\cpp\bin\Intel64;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;D:\Git\cmd;D:\nodejs;D:\Skype\Phone;C:\Program Files (x86)\QuickTime\QTSystem;D:\Visual Studio Code\bin;C:\Users\daima\AppData\Roaming\npm;D:\Git\usr\bin\vendor_perl;D:\Git\usr\bin\core_perl
10 verbose lifecycle react-webpack-babel-starter#0.1.0~start-prod: CWD: F:\react-webpack-babel-starter-master-less
11 silly lifecycle react-webpack-babel-starter#0.1.0~start-prod: Args: [ '/d /s /c', 'npm run build && node express.js' ]
12 silly lifecycle react-webpack-babel-starter#0.1.0~start-prod: Returned: code: 1 signal: null
13 info lifecycle react-webpack-babel-starter#0.1.0~start-prod: Failed to exec start-prod script
14 verbose stack Error: react-webpack-babel-starter#0.1.0 start-prod: `npm run build && node express.js`
14 verbose stack Exit status 1
14 verbose stack at EventEmitter.<anonymous> (D:\nodejs\node_modules\npm\lib\utils\lifecycle.js:279:16)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at EventEmitter.emit (events.js:191:7)
14 verbose stack at ChildProcess.<anonymous> (D:\nodejs\node_modules\npm\lib\utils\spawn.js:40:14)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at ChildProcess.emit (events.js:191:7)
14 verbose stack at maybeClose (internal/child_process.js:885:16)
14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid react-webpack-babel-starter#0.1.0
16 verbose cwd F:\react-webpack-babel-starter-master-less
17 error Windows_NT 6.1.7601
18 error argv "D:\\nodejs\\node.exe" "D:\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "start-prod"
19 error node v7.4.0
20 error npm v4.0.5
21 error code ELIFECYCLE
22 error react-webpack-babel-starter#0.1.0 start-prod: `npm run build && node express.js`
22 error Exit status 1
23 error Failed at the react-webpack-babel-starter#0.1.0 start-prod script 'npm run build && node express.js'.
23 error Make sure you have the latest version of node.js and npm installed.
23 error If you do, this is most likely a problem with the react-webpack-babel-starter package,
23 error not with npm itself.
23 error Tell the author that this fails on your system:
23 error npm run build && node express.js
23 error You can get information on how to open an issue for this project with:
23 error npm bugs react-webpack-babel-starter
23 error Or if that isn't available, you can get their info via:
23 error npm owner ls react-webpack-babel-starter
23 error There is likely additional logging output above.
24 verbose exit [ 1, true ]
How to solve my problem?
To get two css output files, you need to use two instances of the ExtractTextPlugin and configure two rules.
From the documentation
const ExtractTextPlugin = require('extract-text-webpack-plugin');
// Create multiple instances
const extractApp = new ExtractTextPlugin('stylesheets/[name]-one.css');
const extractMedia = new ExtractTextPlugin('stylesheets/[name]-two.css');
module.exports = {
module: {
rules: [
{
test: /app\.less$/,
use: extractApp.extract([ 'css-loader', 'less-loader' ])
},
{
test: /media\.less$/,
use: extractMedia.extract([ 'css-loader', 'less-loader' ])
},
]
},
plugins: [
extractApp,
extractMedia
]
};

Grunt ts task configuration - no files found

I am trying to include TS compilation to my project. This is my tsconfig.json:
{
"compilerOptions": {
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"module": "system",
"moduleResolution": "node",
"noImplicitAny": false,
"outDir": "build/develop/assets/scripts",
"removeComments": false,
"rootDir": "assets/management/",
"sourceMap": false,
"target": "ES5"
},
"exclude": [
"node_modules"
]
}
And this is my tasks/config/ts.js file:
/**
* Compile TS files to JS.
*
* #see https://github.com/TypeStrong/grunt-ts
*/
module.exports = function (grunt) {
grunt.config.set('ts', {
angular_app_dev: {
default: {
// src: [
// "assets/management/**/*.ts",
// "!node_modules/**/*.ts" // Avoid compiling TypeScript files in node_modules
// ],
// outDir: "assets/vili2",
tsconfig: {
tsconfig: true,
ignoreFiles: false,
ignoreSettings: false,
overwriteFilesGlob: false,
updateFiles: true,
passThrough: false
}
// options: {
// module: 'commonjs',
// // To compile TypeScript using external modules like NodeJS
// fast: 'never'
// // You'll need to recompile all the files each time for NodeJS
// }
}
}
});
grunt.loadNpmTasks('grunt-ts');
};
I am trying to make it so that it compiles the TS files ( later I want to add a watch so that it compiles them every time I change them, but one thing at a time )
When I run "tsc" from the command line it works perfectly, however if I run
grunt ts:angular_app_dev -verbose
it produces this:
$ grunt ts:angular_app_dev -verbose
Initializing
Command-line options: --verbose
Reading "Gruntfile.js" Gruntfile...OK
Registering Gruntfile tasks.
Registering "grunt-contrib-clean" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-contrib-clean\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-contrib-clean\package.json...OK
Loading "clean.js" tasks...OK
+ clean
Registering "grunt-contrib-coffee" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-contrib-coffee\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-contrib-coffee\package.json...OK
Loading "coffee.js" tasks...OK
+ coffee
Registering "grunt-contrib-concat" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-contrib-concat\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-contrib-concat\package.json...OK
Loading "concat.js" tasks...OK
+ concat
Registering "grunt-contrib-copy" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-contrib-copy\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-contrib-copy\package.json...OK
Loading "copy.js" tasks...OK
+ copy
Registering "grunt-contrib-cssmin" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-contrib-cssmin\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-contrib-cssmin\package.json...OK
Loading "cssmin.js" tasks...OK
+ cssmin
Registering "grunt-contrib-jst" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-contrib-jst\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-contrib-jst\package.json...OK
Loading "jst.js" tasks...OK
+ jst
Registering "grunt-contrib-less" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-contrib-less\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-contrib-less\package.json...OK
Loading "less.js" tasks...OK
+ less
Registering "grunt-sails-linker" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-sails-linker\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-sails-linker\package.json...OK
Loading "scriptlinker.js" tasks...OK
+ sails-linker
Registering "grunt-sync" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-sync\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-sync\package.json...OK
Loading "sync.js" tasks...OK
+ sync
Registering "grunt-ts" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-ts\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-ts\package.json...OK
Loading "ts.js" tasks...OK
+ ts
Registering "grunt-contrib-uglify" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-contrib-uglify\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-contrib-uglify\package.json...OK
Loading "uglify.js" tasks...OK
+ uglify
Registering "grunt-contrib-watch" local Npm module tasks.
Reading D:\Work\...\...\node_modules\grunt-contrib-watch\package.json...OK
Parsing D:\Work\...\...\node_modules\grunt-contrib-watch\package.json...OK
Loading "watch.js" tasks...OK
+ watch
Loading "Gruntfile.js" tasks...OK
+ build, buildProd, compileAssets, db:migrate, default, linkAssets, linkAssetsBuild, linkAssetsBuildProd, prod, prodTest, syncAssets
Running tasks: ts:angular_app_dev
Running "ts:angular_app_dev" (ts) task
Verifying property ts.angular_app_dev exists in config...OK
File: [no files]
Done, without errors.
What am I missing ???
You are not missing anything. As it says down in the bottom it is "Done, without errors". Remove your -verbose flag for less information about the grunt compilation :)
grunt ts:angular_app_dev should be good enought

grunt-contrib-watch causing Maximum call stack size exceeded

When I execute the clean task (grunt clean), everything works as expected but when I run the watch task (grunt test), I get the following error:
util.js:35
var str = String(f).replace(formatRegExp, function(x) {
^
RangeError: Maximum call stack size exceeded
Here's my gruntfile
module.exports = (grunt) ->
grunt.initConfig
pkg: grunt.file.readJSON('package.json')
clean: ['tmpDir/']
watch:
options:
spawn: false
src:
tasks: ['clean']
files: [
src: 'client/assets/strings/en/str.coffee'
]
# plugins
grunt.loadNpmTasks('grunt-contrib-clean')
grunt.loadNpmTasks('grunt-contrib-watch')
# tasks
grunt.registerTask('test', ['watch'])
Here's my package.json file:
{
"author": "Your Name <Your Email>",
"name": "app-name",
"description": "Application description",
"version": "0.0.1",
"homepage": "",
"repository": {
"type": "git",
"url": ""
},
"engines": {
"node": "~0.10.28"
},
"scripts": {
"start": "muffin server"
},
"dependencies": {
"coffee-script": "~1.1.2",
"express": "~3.0.6",
"chai": "~1.4.2",
"underscore": "~1.4.3",
"wd": "0.0.27"
},
"devDependencies": {
"express": "~3.0.6",
"grunt": "^0.4.5",
"grunt-contrib-coffee": "^0.11.1",
"grunt-contrib-copy": "^0.6.0",
"grunt-contrib-less": "^0.11.4",
"grunt-contrib-watch": "^0.6.1",
"requirejs": "~2.0.1"
}
}
The output when I run with --verbose is the following:
Note: replaced base path with ***
Initializing
Command-line options: --verbose
Reading "gruntfile.coffee" Gruntfile...OK
Registering Gruntfile tasks.
Reading package.json...OK
Parsing package.json...OK
Initializing config...OK
Registering "grunt-contrib-clean" local Npm module tasks.
Reading /***/node_modules/grunt-contrib-clean/package.json...OK
Parsing /***/node_modules/grunt-contrib-clean/package.json...OK
Loading "clean.js" tasks...OK
+ clean
Registering "grunt-contrib-watch" local Npm module tasks.
Reading /***/node_modules/grunt-contrib-watch/package.json...OK
Parsing /***/node_modules/grunt-contrib-watch/package.json...OK
Loading "watch.js" tasks...OK
+ watch
Loading "gruntfile.coffee" tasks...OK
+ test
Running tasks: test
Running "test" task
Running "watch" task
Waiting...
Verifying property watch exists in config...OK
Verifying property watch.src.files exists in config...OK
Warning: Object #<Object> has no method 'indexOf'
Running "watch" task
Waiting...
Verifying property watch exists in config...OK
Verifying property watch.src.files exists in config...OK
Warning: Object #<Object> has no method 'indexOf'
... many of these
Running "watch" task
Waiting...
Verifying property watch exists in config...OK
Verifying property watch.src.files exists in config...OK
Warning: Object #<Object> has no method 'indexOf'
(node) warning: Recursive process.nextTick detected. This will break in the next version of node. Please use setImmediate for recursive deferral.
(node) warning: Recursive process.nextTick detected. This will break in the next version of node. Please use setImmediate for recursive deferral.
... many of these
(node) warning: Recursive process.nextTick detected. This will break in the next version of node. Please use setImmediate for recursive deferral.
util.js:35
var str = String(f).replace(formatRegExp, function(x) {
^
RangeError: Maximum call stack size exceeded
I finally figured out a similar problem I was having with spell. I was using
grunt.registerTask('spell', [ 'spell']);
The trick was that Grunt doesn't seem to like the repetition in names. When I switch to
grunt.registerTask('spellCheck', [ 'spell']);
Everything worked as it should.
may this help you
The files property takes an Array of file pattern strings. You've supplied an object it doesn't know how to interpret.
Change this:
files: [
src: 'client/assets/strings/en/str.coffee'
]
To this:
files: [
'client/assets/strings/en/str.coffee'
]

Resources