Installation - Vite.js
Install Inkline for any Vue.js 3 + Vite.js application, as recommended by the community.
Installation
1 Create a project
Create a new Vite.js + Vue.js application using the npm init
command below or using the Vite.js guide, and follow the instructions provided by the installation wizard.
npm init vue my-vue-app
cd my-vue-app
npm install
2 Install Inkline and dependencies
Install and save Inkline as a project dependency.
npm install --save @inkline/inkline
Inkline uses Sass to pre-process and compile its CSS files. You will need to install it as a development dependency in order to compile the stylesheets.
npm install --save-dev sass
3 Configure your project
Open your src/main.js
or src/main.ts
file and configure your application to use Inkline.
import { createApp } from 'vue';
import App from './App.vue';
import { Inkline, components } from '@inkline/inkline';
import '@inkline/inkline/inkline.scss';
import "./main.scss";
const app = createApp(App);
app.use(Inkline, {
components
});
app.mount('#app');
4 Configure your design
Next, create a new file called src/main.scss
and import Inkline. Learn more about the Design System.
@import '@inkline/inkline/css/variables';
@import '@inkline/inkline/css/mixins';
:root {
--color--primary--h: 195deg;
--color--primary--s: 77%;
--color--primary--l: 39%;
}
5 Enjoy using Inkline
Awesome work! You can now start using all the features that Inkline has to offer.