lint-staged not adding files modified by prettier - prettier

I'm running lint-staged (v11.0.0) as part of my pre-commit hook through Husky (v4.3.8). My lint-staged performs eslint (v7.27.0) and Prettier (v2.3.0). However, after Prettier runs, the "prettified" files aren't added to the commit.
How can files modified by Prettier as part of the lint-staged process be automatically added to the commit?
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"{src,test}/**/*.ts": {
"eslint ./src --ext .ts",
"prettier ./src --write"
}
}

Related

Pre-commit hook (husky + pretty-quick) doesn't work

I've configured prettier and pre-commit hook like before but in my new project husky doesn't run before any commit!
Below is part of the project package.json file:
{
...,
"devDependencies": {
"husky": "^4.3.6",
"prettier": "2.2.1",
"pretty-quick": "^3.1.0"
},
"husky": {
"hooks": {
"pre-commit": "pretty-quick --staged"
}
}
}
I was running into the same problem but i'm using husky ^5.0.9.
Then i read the docs that you need to run npx husky install.
That fixed it for me
In pre-commit, use npm in front of pretty-quick
npx pretty-quick --staged
you should use "husky": "^2.7.0", "prettier": "^1.18.2", "pretty-quick": "^1.11.1",

How to exclude installing pdfmaker and xlsx files of Amcharts4 in package.json file in Angular7

Am using Amcharts4 in angular7 project . After build Vendor.js is 14MB in Size .So load time of the page is taking about 17 seconds .
I saw files like pdfmaker.js 2.54 MB and xlxs.js file of 2MB in dist folder which are related to amcharts .
I don't want those files in dist folder . Or is there any way to reduce the vendor.js file size.
or
how can i exclude unnecessary files form amcharts4.
As i did some R&D work where i kept below line of code in package.json file
"build": "ng build --prod --aot false --build-optimizer false",
But no use .
After ng-install in package-lock.json file i can see below dependencies
"dependencies": {
"#amcharts/amcharts4": {
"version": "4.5.2",
"resolved": "https://registry.npmjs.org/#amcharts/amcharts4/-/amcharts4-4.5.2.tgz",
"integrity": "sha512-oNK5l73DI61svCUYpmU6YfAB6mlJPmaeLeQceOHOVi4MpYpjUSrghX7lS5HzoNASEa1BtEKjauCAbQ2s8z3b0g==",
"requires": {
"#types/regression": "^2.0.0",
"canvg": "^1.5.3",
"css-element-queries": "^1.0.5",
"d3-force": "^2.0.1",
"d3-geo": "^1.11.3",
"d3-geo-projection": "^2.6.0",
"pdfmake": "^0.1.36",
"polylabel": "^1.0.2",
"regression": "^2.0.1",
"tslib": "^1.9.3",
"xlsx": "^0.12.8"
}
},
How Can to exclude "pdfmake": "^0.1.36", "xlsx": "^0.12.8" these dependencies from amharts4 in angular7
Use ngx-build-plus to extend the Angular CLI's default build behavior without ejecting.

Gulp unhandled error 182

I have a django blog project, and am trying to use bower to manage my packages.
When running 'gulp' from my console, I get the following error :
(py3) ➜ nomadpad git:(master) ✗ gulp
[15:16:15] Using gulpfile ~/code/nomadpad/gulpfile.js
[15:16:15] Starting 'css'...
[15:16:16] Finished 'css' after 1.23 s
[15:16:16] Starting 'html'...
[15:16:16] Finished 'html' after 3.38 ms
[15:16:16] Starting 'scripts'...
[15:16:16] Finished 'scripts' after 4.43 ms
[15:16:16] Starting 'default'...
[15:16:16] Finished 'default' after 38 μs
events.js:182
throw er; // Unhandled 'error' event
^
CssSyntaxError: /Users/davidmellor/code/nomadpad/bower_components/jquery/dist/jquery.js:756:9: Unknown word
at Input.error (/Users/davidmellor/code/nomadpad/node_modules/postcss/lib/input.js:119:22)
at Parser.unknownWord (/Users/davidmellor/code/nomadpad/node_modules/postcss/lib/parser.js:506:26)
at Parser.other (/Users/davidmellor/code/nomadpad/node_modules/postcss/lib/parser.js:171:18)
at Parser.parse (/Users/davidmellor/code/nomadpad/node_modules/postcss/lib/parser.js:84:26)
at parse (/Users/davidmellor/code/nomadpad/node_modules/postcss/lib/parse.js:24:16)
at new LazyResult (/Users/davidmellor/code/nomadpad/node_modules/postcss/lib/lazy-result.js:70:24)
at Processor.process (/Users/davidmellor/code/nomadpad/node_modules/postcss/lib/processor.js:117:12)
at /Users/davidmellor/code/nomadpad/node_modules/gulp-postcss/index.js:51:12
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:169:7)
My bower.json in the root folder looks like this :
{
"name": "blog_postcssgulp",
"description": "",
"main": "gulpfile.js",
"authors": [
"DMells <dave#davemellor.com>"
],
"license": "ISC",
"homepage": "https://github.com/DMells/nomadpad",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
],
"dependencies": {
"jquery": "^3.3.1",
"modernizr": "^3.5.0"
}
}
I'm not sure what to do here, please can anyone assist?
Many thanks
If anyone else comes across this, I found the solution by removing my bower_components folder and then reinstalling bower, as well as the jquery package.
npm install bower --save-dev
And then the jquery package:
bower install jquery --save-dev

grunt.js ember-template-compiler not working

I have the grunt-ember-templates plugin, and it used to work. But I did a npm install and it got messed up. Now it does not compile.
The error is this:
Running "watch" task
Waiting...
>> File "resources\hbs\index\module.hbs" changed.
Running "emberTemplates:compile" (emberTemplates) task
>> ReferenceError: ember-template-compiler.js:22258
>> module.exports = Ember.__loader.require("ember-template-compiler");
>> ^
>> module is not defined
Warning: Ember Handlebars failed to compile resources/hbs/error.hbs. Use --force to continue.
Aborted due to warnings.
My Gruntfile.js looks somehow like this:
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
emberTemplates: {
compile: {
options: {
templateBasePath: /resources\/hbs\//,
// Path to the ember-template-compiler of my ember version
templateCompilerPath: 'resources/js/libs/ember-template-compiler.js',
handlebarsPath: 'node_modules/handlebars/dist/handlebars.js'
},
files: {
'resources/js/templates.js': 'resources/hbs/**/*.hbs'
}
}
},
...
Any idea? thanks in advance.
FWIW, it was just a dependency problem. Modifying the package.json to include the latest packages fixed it.

Verbose output in jest js

is any option for verbore output for testing by jest?
I can see which modules are mocked.
I tried
jasmine.VERBOSE = true;
but not working.
Thanks for answer.
To get verbose mode in Jest, you can run Jest with the --verbose tag.
In your packages.json, you can write:
"scripts": {
"test": "jest --verbose"
},
Then you can run npm test
Alternatively, if you are using gulp-jest, to get Jest in verbose mode, find the index.js file of the gulp-jest folder in node_modules and add a verbose: true to the jest.runCLI block.
jest.runCLI({
config: options,
verbose: true
}
simple add in package.json
{
...
...
"jest": {
"verbose": true
},
...
...
}
Create jest.config.js file in root directory and add this to the module export
module.exports = {
// some code here..
verbose: true,
// some code here...
}