curl -o ~/.git-completion.bash https://raw.githubusercontent.com/git/git/master/contrib/completion/git-completion.bash
echo "source ~/.git-completion.bash" >> ~/.bashrc
Even with a normal Playwright + dotenv setup that works on the command line, running Playwright in VSCode seems to pull .env values from settings.json's "playwright.env" object rather than .env. The normal .env variables are undefined.
If you accidentally merge a large, long-running feature branch, then revert it, big problems can arise when trying to reconcile the branches later. Probably better to reset hard before the merge and force push to undo it. Also, disable pushing to develop, even for admins.
Use Ctrl + Alt + Shift + R to open the menu. This is useful because my Framework's Fn key dies randomly, requiring a reboot.
Context: a repo with multiple apps, including a Vue 3 app with storybook, corepack and "packageManager": "[email protected]".
I'm not sure the cause, but VSCode shows weird TS errors only in the Vue 3 app, like claiming async () => {} is wrong:
An async function or method in ES5 requires the 'Promise' constructor. Make sure you have a declaration for the 'Promise' constructor or include 'ES2015' in your '--lib' option
As a workaround, opening the Vue 3 sub-app as the root folder in VSCode rather than the whole monorepo makes the errors go away. There's probably a root jsconfig.json or tsconfig.json that can help resolve the issue.
Exporting a SVG from a d3 graphic led to issues with a missing stylesheet. See this comment for a workaround I used (adding .attr("style", ...) to inline the styles onto each node), and the accompanying thread for some of the quirks, like the allowed CSS selector names.
I don't think arrays of hooks are possible in React 18, but it is (apparently) OK to do arrays of composables in Vue 3:
<!doctype html>
<html lang="en">
<body>
<div id="app">
<button @click="newConversation()">
New Conversation
</button>
<div v-for="(conversation, index) in conversations" :key="index">
<h3>Conversation {{ index + 1 }}</h3>
<ul>
<li v-for="(message, index) in conversation.messages" :key="index">{{ message }}</li>
</ul>
<button @click="addMessageToConversation(index, 'new message')">
Add Message to Conversation {{ index + 1 }}
</button>
</div>
</div>
<script src="https://unpkg.com/[email protected]/dist/vue.global.prod.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@tanstack/[email protected]/build/umd/index.production.min.js"></script>
<script>
const useConversation = () => {
const messages = Vue.ref([]);
//const queryInfo = VueQuery.useQuery("example", () =>
// fetch("https://jsonplaceholder.typicode.com/todos/1")
// .then(res => res.json())
//);
const addMessage = (newMessage) => {
messages.value.push(newMessage);
};
return { messages, addMessage };
};
const app = Vue.createApp({
setup() {
const conversations = Vue.ref([useConversation(), useConversation()]);
const newConversation = () => {
conversations.value.push(useConversation());
};
const addMessageToConversation = (index, newMessage) => {
conversations.value[index].addMessage(newMessage);
};
return { conversations, addMessageToConversation, newConversation };
},
});
app.use(VueQuery.VueQueryPlugin);
app.mount("#app");
</script>
</body>
</html>The problem is, VueQuery throws Error: vue-query hooks can only be used inside setup() function if you uncomment the commented-out useQuery call in the above snippet.
Consider this code:
<div
v-for="question in questions"
@click="switchToQuestion(question)"
>
<button @click="deleteQuestion(question)">
Delete
</button>
</div>I ran into a bug where clicking the Delete button caused the switchToQuestion() handler to be triggered, resulting in switching to an already-deleted question. The solution is to use @click.stop on the inner click handler to prevent bubbling.
Consider this nginx block:
location ~* ^/(foobar)/.*\.(?:css|js|png|jpe?g|gif|ico|svg|eot|ttf|woff2?)$ {
expires 365d;
add_header Pragma public;
add_header Cache-Control "public, must-revalidate, proxy-revalidate";
access_log off;
try_files $uri /$uri.html $1 /index.html =404;
}
This led to a super annoying caching problem where during deployment, the JS files might not be served properly and wind up serving the SPA's index.html instead of a JS script, which would throw an error Uncaught SyntaxError: expected expression, got '<' then be cached for a year, causing the app to fail.
The solution was getting those .html files out of the try_files line: try_files $1 $uri =404;.
Per this comment, use
{
server: {
host: '0.0.0.0'
}
}in vite.config.js.
Previously working, abruptly not with the titular error. I tried certbot -q renew --nginx but ran into an error that the .pem files weren't found. I noticed in /etc/nginx/sites-available/my-site that there was a number of incorrect paths to /etc/letsencrypt/live/my-domain.com/ (for example, ssl_certificate /etc/letsencrypt/live/wrong-domain.com/fullchain.pem). nginx -t failed to validate the path. After fixing the config paths to point to the correct domain and re-running certbot, the certificate was renewed and nginx -t ran clean.
I'm not sure how the bad links got into the nginx config in the first place, though, or why this config only suddenly started to matter, since the site worked fine for over a year without intervention (other than a domain name renewal nearly 90 days ago, but not quite--might be related).
I may need a cron job to auto-renew.
Adding proxy_buffering off; to the http section in /etc/nginx/nginx.conf and running sudo systemctl restart nginx worked for my Flask app running in a DigitalOcean Droplet.
See EventSource / Server-Sent Events through Nginx and Server-Sent Events in Flask work locally but not on production (linode).
Note that this can harm performance and should only be applied to the specific SSE route. There may be a better approach.
./execute_me.c -> hello world:
#if 0
# https://news.ycombinator.com/item?id=39272890
set -e; [ "$0" -nt "$0.bin" ] &&
gcc -Wall -Wextra -pedantic -std=c99 "$0" -o "$0.bin"
exec "$0.bin" "$@"
#endif
#include <stdio.h>
int main() {
puts("hello world");
return 0;
}See also this comment
git grep -i pattern basically greps the way I want to, respecting .gitignore.
I can replace alias g="grep -RiP --exclude-dir={node_modules,.git,build,dist}" with alias g="git grep -i".
In auth0 with React, if the app gives a blank screen, it could be because of bad Auth0 .env credentials.
I had logic in a discogs userscript to extract youtube video links for playing with mpv, but it turns out mpv -no-vid https://www.discogs.com/master/27848-Amon-D%C3%BC%C3%BCl-Paradiesw%C3%A4rts-D%C3%BC%C3%BCl works just fine, as do many other URLs (like Bandcamp artists and albums).
Every new bash terminal window in Ubuntu gave
Command 'ng' not found, but can be installed with:
sudo apt install ng-common
greg@greg-framework:~$
upon opening. This occurred after upgrading Node 18 to 20 with nvm. The fix was removing
# Load Angular CLI autocompletion.
source <(ng completion script)from ~/.bashrc.