assetize
v2.1.14
Published
A versatile assets class builder for your project! fixes asset imports.
Downloads
51
Maintainers
Readme
Assetify 🎨
A versatile assets class builder for your project!
Introduction
Tired of manually importing assets like public/icons/myicon.ico
in your project? Say goodbye to the hassle with Assetify! This handy tool automates asset imports, making your workflow smoother and more efficient.
To generate the assets file, you need to run the assetize:build
command. Remember to do this each time you make changes to files in the root assets folder.
Example
// Import Assetify
import MyAssets from "./assetize.gen";
export default function Home() {
return (
<Image
src={MyAssets.icons.vercel.path} // Access assets
alt="Vercel Logo"
width={202}
height={206}
/>
);
}
Install
npm install assetize
@antfu - use ni instead of package mangers, ni
npx assetize generate
Generates a default config file in your project's root directory. you can generate yourself by importing defineAssetizeConfig
from assetize
and passing it your config. Config file name must be assetize.config.{js,ts,mts,mjs}
.
import { defineAssetizeConfig } from "assetize";
export default defineAssetizeConfig({
codebase: "remix",
});
It will create the assets directory in your project's root directory.
npx assetize init
Build
npx assetize build
Builds your assets according to your config file.
Issues
Submit your issues to the assetize repository. 🤖
Support
- [x] Remix
- [x] Next JS
- [x] Svelte
- [ ] Vue
- [x] Vite
- [x] Nuxt
- [x] Astro
- [ ] Solid
- [x] Preact
- [ ] Solid
Pubic Requested Assets folder
Currently
- icons
- images
- videos
- svgs
- fonts
Todo add here
- upcoming