Registry / web-framework / af-mobile-client-vue3

af-mobile-client-vue3

library1.5.81jsnpmunverified

A Vue 3 + Vite 5 mobile application template integrating Vant 4, Pinia 2, and TypeScript, designed as a micro-frontend host for micro-app. Current stable version is 1.5.81. It provides a complete mobile development scaffold with automatic component importing, mock server support, dark mode, and Git hooks. Differentiators: pre-configured for micro-app micro-frontend architecture, opinionated directory structure, and Chinese-friendly documentation. Requires Node >=20.19.0 as per engines field.

web-framework

npm install af-mobile-client-vue3

package ↗

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–223 runs

build_error

glibc

node 18–223 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

App

✓ import App from './App.vue'

✗ import App from 'af-mobile-client-vue3'

The package is a project template, not a library; you import your own components, not from this package.

Vue

✓ import { createApp } from 'vue'

✗ import { createApp } from 'af-mobile-client-vue3'

Vue utilities are imported directly from 'vue', not from this package.

Vant

✓ import { Button } from 'vant'

✗ import { Button } from 'af-mobile-client-vue3'

Vant components are imported from the 'vant' package, not from this template.

Shows how to start development with the template: install dependencies, run dev server, build, and use a Vant button component without explicit import due to auto-import.

# Clone the template (assuming you have derived the repo) # Install dependencies pnpm install # Start development server pnpm dev # Build for production pnpm build # Example usage in a component after setup: <template> <van-button type="primary">Primary Button</van-button> </template> <script setup lang="ts"> // No import needed if using automatic component registration </script>

Debug

Known issues

gotchaThe package is a project template, not a reusable npm library. Do not attempt to import components from 'af-mobile-client-vue3' in your own projects.

fix

Use this package as a starter template by cloning or deriving its repository, then modify for your needs.

affects: all

gotchaRequires Node.js >=20.19.0. Older Node versions will fail to install or run.

fix

Upgrade Node to >=20.19.0 using nvm or other version manager.

affects: >=1.0.0

gotchaThis template is designed to be a micro-app (micro-frontend) host. If you do not use micro-app, you may need to remove related configuration (e.g., micro-app dependency, microApps.ts registration).

fix

Remove micro-app from package.json and delete microApps.ts if not using micro-frontend.

affects: all

gotchaAutomatic component registration (unplugin-vue-components) is configured; manually importing Vant components may cause double registration or conflicts.

fix

Use components in templates without explicit import; if you need to import manually, ensure auto-import is disabled.

affects: all

deprecatedThe README references 'af-example-mobile-vue-web' as an example project name. This package is 'af-mobile-client-vue3' and the example project may be outdated.

fix

Update references in your derived project to match your actual project name.

affects: <=1.5.81

Errors

Common errors & fixes

Error: The engine "node" is incompatible with this module. Expected version ">=20.19.0". Got "16.x.x"

Node version is below the minimum required 20.19.0

fix

Upgrade Node.js to version 20.19.0 or higher (e.g., nvm install 20.19.0 && nvm use 20.19.0)

Module not found: Error: Can't resolve 'vant'

Vant dependency not installed or not in package.json

fix

Run 'pnpm install' to install all dependencies, including Vant, which is a dependency of this template.

TypeError: Cannot read properties of undefined (reading 'install')

Attempting to import and use a component from 'af-mobile-client-vue3' which is a template, not a library

fix

Do not import anything from 'af-mobile-client-vue3'; instead use Vant components directly from 'vant' package.

Error: The 'microApps' is not defined in vue-router

If not using micro-app, the microApps.ts file is missing or not configured

fix

Remove or comment out imports and references to microApps.ts in your router configuration.

Upgrade

Version history

1.5.81latest on PyPI

Audit

Dependencies

vuerequiredCore framework dependency

viterequiredBuild tool and dev server

vantrequiredMobile UI component library

piniarequiredState management

micro-appoptionalMicro-frontend framework for host capabilities

Agent activity

60 hits · last 30 days

node

claudebot

ahrefsbot

amazonbot

Resources

packagehttps://www.npmjs.com/package/af-mobile-client-vue3 ↗