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

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://[email protected]/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.