0.0.5 • Published 6 months ago

nuxt-liff v0.0.5

Weekly downloads
-
License
MIT
Repository
github
Last release
6 months ago

Nuxt LIFF Module

npm version npm downloads License Nuxt

This module makes it easy to deploy LIFF.

It also supports mock mode using LIFF Mock, making it easy to test LIFF apps.

About LIFF (LINE Front-end Framework)

The LINE Front-end Framework (LIFF) is a web application framework provided by LY Corporation. When you integrate the LIFF SDK into your web app, you will be able to access information provided by the LINE Platform or use functionalities provided by the LINE app.

About LIFF Mock

LIFF Mock is a LIFF plugin to make testing your LIFF app easy. Using LIFF Mock, you can add the mock mode to the LIFF SDK. In the mock mode, your LIFF app is independent of the LIFF server and the LIFF API returns mock data. Therefore, you can perform unit testing or load testing more easily.

Features

  •  Just set your LIFF ID and you are ready to use LIFF!
  • 🚠  Mock mode is available with a single setting
  • 🌲  Customize the response from LIFF in mock mode

Quick Setup

1. Add nuxt-liff dependency to your project

# Using pnpm
pnpm add -D nuxt-liff

# Using yarn
yarn add --dev nuxt-liff

# Using npm
npm install --save-dev nuxt-liff

2. Add nuxt-liff to the modules section of nuxt.config.ts

export default defineNuxtConfig({
  modules: [
    'nuxt-liff'
  ]
})

3. Configure module settings

import * as mockData from './mock-data';

export default defineNuxtConfig({
  modules: [
    'nuxt-liff'
  ],
  // Module settings
  liff: {
    // Specify your LIFF ID
    liffId: 'your-liff-id-here',
    // Set to true to use mock mode
    mock: true,
    // When using mock mode, you can set mock data for each API
    // @see https://developers.line.biz/en/reference/liff/
    mockData: {
      getProfile: mockData.getProfile(),
      getOS: 'android',
    },
  },
});

That's it! You can now use Nuxt LIFF Module in your Nuxt app ✨

Development

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch

# Release new version
npm run release