Research
Recent Trends in Malicious Packages Targeting Discord
The Socket research team breaks down a sampling of malicious packages that download and execute files, among other suspicious behaviors, targeting the popular Discord platform.
babel-plugin-blade
Advanced tools
Readme
inline GraphQL
This is a plugin for solving the double declaration problem in GraphQL queries.
What is the "double declaration problem"? Simply it is the bad developer experience of first having to declare what you want to query in the GraphQL template string, and then again when you are using the data in your application. Ommissions are confusing to debug and overfetching due to stale queries is also a problem.
This plugin gives you createQuery
and createFragment
functions to wrap around the root data
property of whatever GraphQL client you use. It then tracks everything you do with data
and generates a GraphQL query based on your usage.
This is accomplished by hooking in to Babel to building up a tree of downstream dependencies on data
. For query arguments, the arguments are stripped and an alias generated for that specific query.
babel-plugin-macros
This module is distributed via npm which is bundled with node and
should be installed as one of your project's devDependencies
:
npm install --save-dev babel-plugin-blade
Add it to your babel config.
Before:
import {Connect, query} from 'urql'
const movieQuery = createQuery()
const Movie = ({id, onClose}) => (
<div>
<Connect
query={query(movieQuery, {id: id})}
children={({data}) => {
const DATA = movieQuery(data)
return (
<div>
<h2>{DATA.movie.gorilla}</h2>
<p>{DATA.movie.monkey}</p>
<p>{DATA.chimp}</p>
</div>
)
}}
/>
</div>
)
After:
import {Connect, query} from 'urql'
const Movie = ({id, onClose}) => (
<div>
<Connect
query={query(
`
query movieQuery{
movie {
gorilla
monkey
}
chimp
}`,
{id: id},
)}
children={({data}) => {
const DATA = data
return (
<div>
<h2>{DATA.movie.gorilla}</h2>
<p>{DATA.movie.monkey}</p>
<p>{DATA.chimp}</p>
</div>
)
}}
/>
</div>
)
.babelrc
(Recommended).babelrc
{
"plugins": ["blade"]
}
babel --plugins blade script.js
require('babel-core').transform('code', {
plugins: ['blade'],
})
babel-plugin-macros
Once you've
configured babel-plugin-macros
you can import/require the blade macro at babel-plugin-blade/macro
. For
example:
import { createQuery } from 'babel-plugin-blade/macro'
import {Connect, query} from 'urql'
const movieQuery = createQuery()
const Movie = () => (
<div>
<Connect
query={query(movieQuery)}
children={({data}) => {
const DATA = movieQuery(data)
return (
<div>
<h2>{DATA.movie.gorilla}</h2>
<p>{DATA.movie.monkey}</p>
<p>{DATA.chimp}</p>
</div>
)
}}
/>
</div>
)
↓ ↓ ↓ ↓ ↓ ↓
import { Connect, query } from 'urql';
const Movie = () => <div>
<Connect query={query(`
query movieQuery{
movie {
gorilla
monkey
}
chimp
}`)} children={({ data }) => {
const DATA = data;
return <div>
<h2>{DATA.movie.gorilla}</h2>
<p>{DATA.movie.monkey}</p>
<p>{DATA.chimp}</p>
</div>;
}} />
</div>;
You could also use
blade.macro
if you'd prefer to type less 😀
This plugin is still very new, please don't use in production unless you are willing to help me out on fixing any bugs you find!
This is based on babel-plugin-macros.
I'm not aware of any, if you are please make a pull request and add it here!
MIT
FAQs
generate inline graphql
The npm package babel-plugin-blade receives a total of 4 weekly downloads. As such, babel-plugin-blade popularity was classified as not popular.
We found that babel-plugin-blade demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
The Socket research team breaks down a sampling of malicious packages that download and execute files, among other suspicious behaviors, targeting the popular Discord platform.
Security News
Socket CEO Feross Aboukhadijeh joins a16z partners to discuss how modern, sophisticated supply chain attacks require AI-driven defenses and explore the challenges and solutions in leveraging AI for threat detection early in the development life cycle.
Security News
NIST's new AI Risk Management Framework aims to enhance the security and reliability of generative AI systems and address the unique challenges of malicious AI exploits.