Skip to content

Vue.js file input with Drag and Drop support. Mostly for personal use.

License

Notifications You must be signed in to change notification settings

AlttiRi/vue-file-input

Repository files navigation

vue-file-input

Vue.js file input with Drag and Drop support.

Mostly for personal use.

Demo

<template>
  <FileInput :state="state"/>
</template>

<script setup>
import {FileInput, getStateInstance} from "@alttiri/vue-file-input";

const state = getStateInstance({recursive: true});
globalThis.state = state;
</script>

This demo is online: https://alttiri.github.io/vue-file-input/

Installation

From NPM

npm install @alttiri/vue-file-input

From GitHub repository

npm install git+https://github.com/alttiri/vue-file-input.git
More ways

From GitHub repository (a specific version):

  • Based on SemVer:

    npm install git+https://github.com/alttiri/vue-file-input.git#semver:1.3.0

    Or add

    "@alttiri/vue-file-input": "github:alttiri/vue-file-input#semver:1.3.0"
    

    as dependencies in package.json file.

    See available tags.

  • Based on a commit hash:

    npm install git+https://git@github.com/alttiri/vue-file-input.git#c69898556be0b92bee92b0b96249e5731a2fbf47

    Or add

    "@alttiri/vue-file-input": "github:alttiri/vue-file-input#c69898556be0b92bee92b0b96249e5731a2fbf47"
    

    as dependencies in package.json file.

    See available commits hashes.

From GitHub Packages:

To install you need first to create .npmrc file with @alttiri:registry=https://npm.pkg.github.com content:

echo @alttiri:registry=https://npm.pkg.github.com >> .npmrc

only then run

npm install @alttiri/vue-file-input

Note, that GitHub Packages requires to have also ~/.npmrc file (.npmrc in your home dir) with //npm.pkg.github.com/:_authToken=TOKEN content, where TOKEN is a token with the read:packages permission, take it here https://github.com/settings/tokens/new.