Download the PHP package oblik/kirby-vite without Composer
On this page you can find all versions of the php package oblik/kirby-vite. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download oblik/kirby-vite
More information about oblik/kirby-vite
Files in oblik/kirby-vite
Package kirby-vite
Short Description Kirby plugin that handles development and production mode of Vite.
License MIT
Homepage https://github.com/OblikStudio/kirby-vite#readme
FAQ
Example:
In general, it is recommended to use always a project to download your libraries. In an application normally there is more than one library needed.
- Some hosting areas are not accessible by a terminal or SSH. Then it is not possible to use Composer.
- To use Composer is sometimes complicated. Especially for beginners.
- Composer needs much resources. Sometimes they are not available on a simple webspace.
- If you are using private repositories you don't need to share your credentials. You can set up everything on our site and then you provide a simple download link to your team member.
- Simplify your Composer build process. Use our own command line tool to download the vendor folder as binary. This makes your build process faster and you don't need to expose your credentials for private repositories.
Informations about the package kirby-vite
Kirby Vite Plugin
Plugin for Kirby that allows you to load assets generated by Vite.
- In development mode, assets are loaded by Vite's development server, allowing you to benefit from all of its features, such as HMR.
- In production mode, URLs to the built assets are provided and served by PHP.
Another similar plugin is arnoson/kirby-vite, but it's more complicated and relies on the manual generation of a .lock file (omittable by relying on the manifest's presence solely). Thus, it inspired the creation of this plugin.
Note: Developed and tested with Vite 3.1.2.
How It Works
The plugin depends on Vite's manifest functionality, which generates a manifest.json file that contains a mapping of non-hashed asset filenames to their hashed versions, used by this plugin to render the correct asset links. If this file doesn't exist, it's assumed that Vite is running in development mode and the plugin attempts to request files from Vite's develpment server.
How to Use
Installation
Composer
You can find oblik/kirby-vite on packagist:
Download
Download and copy this repository to /site/plugins/vite.
Git Submodule
Enable Manifest
Make sure you've enabled the build.manifest option in your vite.config.js:
ℹ️ You may want to take a deep dive into Vite's backend integration guide to get an idea how Vite handles assets in traditional backends.
Output JavaScript
You need to pass your entry script to the js() method:
Output CSS
You have to do the same as for JavaScript, but use the css() method:
Note: When using Vite, CSS files aare imported in the main JavaScript file. In order to find the CSS from the generated manifest, the plugin needs the file that imports your CSS, not the CSS file itself.
Note 2: In development mode, the css() method does nothing because Vite automatically loads your CSS when your JavaScript loads, as well as the required @vite/client script. In other words, vite()->js() loads everything.
Remove Generated Assets
As explained in the How It Works section, to ensure proper function, you should remove the build folder every time you start your development server. This can easily be done with rm -rf in your npm dev script:
Options
In your config.php, make sure you configure the plugin to match your vite.config.js:
Note: The values above are the default ones, so if they match your setup, you don't need to configure anything. 🤙
License
Oblik Studio
