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

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",

Related

Run SvelteKit app on production as server

I have an app created with last SveltieKit, how can I run results of npm run build as server?
After build I have created .sveltie-kit folder with multiple files inside. I tried to run node .sveltie-kit/build/server.js but it does not work.
Versions:
"devDependencies": {
"#sveltejs/adapter-auto": "^1.0.0",
"#sveltejs/kit": "^1.0.1",
"#sveltejs/vite-plugin-svelte": "^2.0.2",
"#tsconfig/svelte": "^3.0.0",
"#types/express": "^4.17.15",
"node-sass": "^8.0.0",
"sass": "^1.57.1",
"svelte": "^3.55.0",
"svelte-check": "^3.0.1",
"svelte-preprocess": "^5.0.0",
"tslib": "^2.4.1",
"typescript": "^4.9.4",
"vite": "^4.0.3"
},
If you want SvelteKit to generate a standalone Node server you have to use the node adapter.
// svelte.config.js
import adapter from '#sveltejs/adapter-node';
export default {
kit: {
adapter: adapter()
}
};
By default this will create a build directory you can run node on.
node build

How do i solve Expo problem SDK 46 when i do eas update?

i update my cli and the version of my app .
My expo go is now SDK 46 supported.
Before to do eas update, my app was working well on my phone.
Since that, i have this message when i try to do expo start and eas update with the public link
Do you think it could from an other package ?
this is also my package.json
"dependencies": {
"expo": "~46.0.7",
"expo-status-bar": "~1.4.0",
"react": "18.0.0",
"react-native": "0.69.4",
"#react-native-async-storage/async-storage": "~1.17.3",
"#react-native-community/datetimepicker": "6.2.0",
"#react-navigation/bottom-tabs": "^6.3.1",
"#react-navigation/native": "^6.0.10",
"#react-navigation/native-stack": "^6.6.2",
"expo-checkbox": "~2.2.0",
"expo-cli": "6.0.0",
"expo-location": "~14.3.0",
"expo-media-library": "~14.2.0",
"expo-splash-screen": "~0.16.1",
"expo-updates": "~0.14.4",
"moment": "^2.29.4",
"react-dom": "18.0.0",
"react-native-calendars": "^1.1275.0",
"react-native-maps": "0.31.1",
"react-native-safe-area-context": "4.3.1",
"react-native-screens": "~3.15.0",
"react-native-web": "~0.18.7"
},
"devDependencies": {
"#babel/core": "^7.12.9"
},
"private": true
}
Make sure your Expo config file in app.json or app.config.js specifies the correct sdkVersion.
{
"expo": {
...
"sdkVersion": "46.0.0", // I was missing this line
...
}
}
You need to do expo upgrade in command line to update your SDK version. This same if you test on your phone, you need to update expo app on a store. Then you gotta have same SDK versions.

Popper.js problem with Bootstrap modals in Laravel 5.8

I'm creating a web application based on Laravel 5.8 + Laravelmix + bootstrap + Vue
(which is how Lravel comes out of the box)
Problem is that bootstrap modals will not work - not out of the box at least.
If you try to trigger a modal you get an error in the console, regarding a popper map component (needed by jquery) that is there (in fact) but for some reason it doesn't get properly added to the mix.
This is a know problem: I found other questions and threads about this problem in Stackoverflow, however...
Problem in the problem: all existing QAs that i found take for granted that who reads knows quite a lot about npm webpack and laravel mix... and I don't! :-( I'm mostly a backend developer, not a frontend dev: I know basic Javascript but don't know much about webpack and I haven't been able to apply the suggested solutions to my case.
Could somebody explain to me in clear terms how my js assets should look like in order to work???
This is my webpack.mix file:
const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css');
This is my resources/js/app.js file:
require('./bootstrap');
window.Vue = require('vue');
Vue.component('example-component', require('./components/ExampleComponent.vue').default);
const app = new Vue({
el: '#app',
});
This is the beginning of my resoureces/js/bootstrap.js file looks like:
window._ = require('lodash');
try {
window.Popper = require('popper.js').default;
window.$ = window.jQuery = require('jquery');
require('bootstrap');
} catch (e) {}
window.axios = require('axios');
And finally this is my package.json file:
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},
"devDependencies": {
"axios": "^0.18",
"bootstrap": "^4.0.0",
"cross-env": "^5.1",
"jquery": "^3.2",
"laravel-mix": "^4.0.7",
"lodash": "^4.17.5",
"popper.js": "^1.12",
"resolve-url-loader": "2.3.1",
"sass": "^1.20.1",
"sass-loader": "7.*",
"vue": "^2.5.17",
"vue-template-compiler": "^2.6.10"
}
}

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

The Broccoli Plugin: [UglifyWriter] failed with

I've had this error for 2 weeks now while trying to build an ember app in production. Building it in dev environment works fine. I also realized that disabling minifyJs in ember-cli-build prevents the error but then, the app gets stuck at loading in the browser, and in the console, I see another error: "could not import ember-resolver".
My guess is that this is as a result of the UglifyWriter not understanding some code somewhere.
The full error is:
Build failed.
File: assets/vendor.js (95443:4)
The Broccoli Plugin: [UglifyWriter] failed with:
Error
at new JS_Parse_Error (eval at (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), :1545:18)
at js_error (eval at <anonymous> (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), <anonymous>:1553:11)
at croak (eval at <anonymous> (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), <anonymous>:2092:9)
at token_error (eval at <anonymous> (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), <anonymous>:2100:9)
at unexpected (eval at <anonymous> (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), <anonymous>:2106:9)
at semicolon (eval at <anonymous> (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), <anonymous>:2126:56)
at simple_statement (eval at <anonymous> (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), <anonymous>:2317:73)
at eval (eval at <anonymous> (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), <anonymous>:2186:19)
at eval (eval at <anonymous> (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), <anonymous>:2139:24)
at block_ (eval at <anonymous> (/home/larisoft/frontend/node_modules/uglify-js/tools/node.js:1:1), <anonymous>:2432:20)
The broccoli plugin was instantiated at:
at UglifyWriter.Plugin (/home/larisoft/frontend/node_modules/broccoli-plugin/index.js:7:31)
at new UglifyWriter (/home/larisoft/frontend/node_modules/broccoli-uglify-sourcemap/index.js:25:10)
at UglifyWriter (/home/larisoft/frontend/node_modules/broccoli-uglify-sourcemap/index.js:20:12)
at Class.postprocessTree (/home/larisoft/frontend/node_modules/ember-cli-uglify/index.js:15:50)
at /usr/local/lib/node_modules/ember-cli/lib/broccoli/ember-app.js:543:27
at Array.forEach (native)
at EmberApp.addonPostprocessTree (/usr/local/lib/node_modules/ember-cli/lib/broccoli/ember-app.js:541:23)
at EmberApp.toTree (/usr/local/lib/node_modules/ember-cli/lib/broccoli/ember-app.js:1667:15)
at module.exports (/home/larisoft/frontend/ember-cli-build.js:37:16)
at Class.setupBroccoliBuilder (/usr/local/lib/node_modules/ember-cli/lib/models/builder.js:70:19)
my package.json
{
"name": "hospitalrun",
"version": "0.9.12",
"description": "Ember front end for HospitalRun",
"homepage": "http://curacel.co",
"directories": {
"doc": "doc",
"test": "tests"
},
"scripts": {
"build": "./script/build",
"start": "./script/server",
"test": "snyk test && ./script/test"
},
"repository": {
"type": "git",
"url": "git#github.com:HospitalRun/hospitalrun-frontend"
},
"engines": {
"node": ">= 0.10.0"
},
"author": "John Kleinschmidt",
"contributors": [
"Joel Worrall",
"Joel Glovier"
],
"license": "GPL-3.0",
"devDependencies": {
"body-parser": "^1.14.2",
"broccoli-asset-rev": "^2.4.1",
"broccoli-export-text": "0.0.2",
"broccoli-funnel": "^1.0.1",
"broccoli-manifest": "0.0.7",
"broccoli-merge-trees": "^1.0.0",
"broccoli-serviceworker": "0.1.0",
"ember-ajax": "2.3.2",
"ember-cli": "^2.4.1",
"ember-cli-active-link-wrapper": "0.2.0",
"ember-cli-app-version": "^1.0.0",
"ember-cli-content-security-policy": "0.5.0",
"ember-cli-dependency-checker": "^1.2.0",
"ember-cli-deprecation-workflow": "0.2.2",
"ember-cli-fake-server": "0.3.1",
"ember-cli-htmlbars": "^1.0.7",
"ember-cli-htmlbars-inline-precompile": "^0.3.1",
"ember-cli-inject-live-reload": "^1.3.1",
"ember-cli-qunit": "^2.0.0",
"ember-cli-release": "1.0.0-beta.1",
"ember-cli-sass": "^5.2.1",
"ember-cli-scss-lint": "1.0.0",
"ember-cli-sri": "^2.1.0",
"ember-cli-uglify": "^1.2.0",
"ember-data": "^2.4.0",
"ember-disable-proxy-controllers": "^1.0.1",
"ember-export-application-global": "^1.0.4",
"ember-font-awesome": "2.1.1",
"ember-i18n": "4.2.1",
"ember-load-initializers": "^0.5.0",
"ember-pouch": "^3.1.0",
"ember-rapid-forms": "1.0.0-beta4",
"ember-resolver": "^2.0.3",
"ember-select-list": "0.9.5",
"ember-simple-auth": "^1.1.0-beta.3",
"ember-simple-auth-registration": "1.0.2",
"ember-suave": "2.0.1",
"ember-truth-helpers": "1.2.0",
"ember-validations": "2.0.0-alpha.4",
"express": "^4.8.5",
"glob": "^7.0.0",
"hospitalrun-dblisteners": "0.9.2",
"hospitalrun-server-routes": "0.9.7",
"loader.js": "^4.0.7",
"nano": "6.2.0",
"request": "2.72.0"
},
"dependencies": {
"ember-cli-babel": "^5.1.5",
"ember-cli-uglify": "^1.2.0",
"ember-radio-buttons": "^4.0.1",
"ember-resolver": "^2.1.0",
"snyk": "^1.14.1",
"sw-toolbox": "^3.1.1",
"uglify-js": "^2.7.4"
},
"ember-addon": {
"paths": [
"lib/pouch-fixtures"
]
}
}
My ember-cli-build:
/* global require, module */
var EmberApp = require('ember-cli/lib/broccoli/ember-app');
module.exports = function(defaults) {
var app = new EmberApp(defaults, {
// Add options here
});
// Use `app.import` to add additional libraries to the generated
// output files.
//
// If you need to use different assets in different
// environments, specify an object as the first parameter. That
// object's keys should be the environment name and the values
// should be the asset to use in that environment.
//
// If the library that you are including contains AMD or ES6
// modules that you would like to import into your application
// please specify an object with the list of modules as keys
// along with the exports of each module as its value.
app.import('vendor/pouchdb-list/pouchdb-list.js');
app.import('bower_components/node-uuid/uuid.js');
app.import('bower_components/bootstrap/dist/js/bootstrap.js');
app.import('bower_components/JsBarcode/CODE128.js');
app.import('bower_components/JsBarcode/JsBarcode.js');
app.import('vendor/dymo/DYMO.Label.Framework.1.2.6.js');
app.import('bower_components/moment/moment.js');
app.import('bower_components/typeahead.js/dist/typeahead.bundle.js');
app.import('bower_components/pikaday/pikaday.js');
app.import('bower_components/filer.js/src/filer.js');
app.import('bower_components/idb.filesystem/src/idb.filesystem.js');
app.import('bower_components/pikaday/css/pikaday.css');
app.import('vendor/octicons/octicons/octicons.css');
app.import('bower_components/pouchdb-load/dist/pouchdb.load.js');
app.import('bower_components/pouchdb/dist/pouchdb.memory.js');
return app.toTree();
};
It seems like uglify.js has some problems with ES6 files: https://forum.ionicframework.com/t/uglifyjs-fails-with-js-parse-error-error-but-no-stack-trace/66094. In my case it was enough to downgrade one library (fold-to-ascii) to an ES5 version.
Unfortunately, an error message isn't very helpful, so finding the problematic file is unnecessarily difficult. It's hard to tell which file causes the error in Your case, but I can at least say what helped me.
I manually put a log (with help from http://discuss.emberjs.com/t/debugging-failures-in-uglifyjs/7390/6):
function js_error(message, filename, line, col, pos) {
console.log(`message: ${message} / filename: ${filename} / line: ${line}`);
throw new JS_Parse_Error(message, filename, line, col, pos);
};
into js_error function of node_modules/uglify-js/lib/parse.js (line 205 in my case), and got a message that was actually helpful:
message: SyntaxError: Unexpected token: name (ASCIIFolder) / file: 0 / line: 64911 / position: 2070881
Then, with the find in path search on text "ASCIIFolder", I was able to locate the problematic files.
Also it may be necessary to do 'clean' install of npm and bower packages (https://emberigniter.com/update-latest-ember-data-cli/):
npm cache clean && bower cache clean
rm -rf node_modules bower_components dist tmp
npm install
bower install
Alternatively You can completely disable minifying of vendor.js with [https://ember-cli.com/asset-compilation#exclude-from-minification] (although it's not the greatest solution):
// ember-cli-build.js
var EmberApp = require('ember-cli/lib/broccoli/ember-app');
module.exports = function(defaults) {
var app = new EmberApp(defaults, {
minifyJS: {
options: {
exclude: ["**/vendor.js"]
}
}
});
//...
return app.toTree();
};
which tells broccoli-uglify-sourcemap to ignore vendor.js and, therefore, should prevent an error from happening.
UPDATE:
If you are not supporting IE9 browsers then you can use ember-cli-uglify#2.0.0 stable release for minification.
uglifyjs has problem in minifying the newer ES features, you can use ember-cli-babili to minify the javascript babili in Ember-CLI.
npm uninstall --save-dev ember-cli-uglify
npm install --save-dev ember-cli-babili
I am using it my app. It's mentioned by RWJBlue in his blog(http://rwjblue.com/2017/04/21/ember-cli-targets/)
I was tired of such errors, so I replaced uglify-js with upglify-es.
Using yarn and ember-cli:
yarn upgrade ember-cli-uglify#2.0.0-beta.1
In my case I got:
Build Error (UglifyWriter)
Unexpected token: eof (undefined)
The solution was to update ember-cli-moment-shim to version v3.8.0