rei-mirrors/dockview
1
0
Fork 0
mirror of https://github.com/mathuo/dockview synced 2025-08-24 19:16:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: npm scripts

Browse Source
This commit is contained in:
mathuo 2025-07-30 21:46:10 +01:00
parent d3996e29ee
commit 85ae6c2cde
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
8 changed files with 82 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.github/workflows/main.yml vendored
View File

@ -25,7 +25,7 @@ jobs:
- run: yarn
- run: npm run build
- run: npm run pack
- run: npm run build:bundle
- run: npm run test:cov
- name: SonarCloud Scan
uses: sonarsource/sonarqube-scan-action@v5

127
CLAUDE.md
View File

@ -9,93 +9,108 @@ Dockview is a zero-dependency layout manager supporting tabs, groups, grids and
## Development Commands
### Build
- `npm run build` - Build core packages (dockview-core, dockview, dockview-vue, dockview-react)
- `npm run clean` - Clean all packages
- `npm run build` - Build core packages (dockview-core, dockview, dockview-vue, dockview-react)
- `npm run clean` - Clean all packages
### Testing
- `npm test` - Run Jest tests across all packages
- `npm run test:cov` - Run tests with coverage reporting
- `npm test` - Run Jest tests across all packages
- `npm run test:cov` - Run tests with coverage reporting
### Linting
- `npm run lint` - Run ESLint on TypeScript/JavaScript source files across packages
- `npm run lint:fix` - Run ESLint with automatic fixing of fixable issues
- `npm run lint` - Run ESLint on TypeScript/JavaScript source files across packages
- `npm run lint:fix` - Run ESLint with automatic fixing of fixable issues
### Documentation
- `npm run docs` - Generate documentation using custom script
- `npm run docs` - Generate documentation using custom script
### Package Management
- `npm run version` - Version packages using Lerna
- `npm run package` - Package build artifacts
- `npm run package-docs` - Package documentation
- `npm run version` - Version packages using Lerna
- `npm run build:bundle` - Package build artifacts
- `npm run generate-docs` - Package documentation
## Architecture
### Monorepo Structure
- **packages/dockview-core** - Core layout engine (TypeScript, framework-agnostic)
- **packages/dockview** - React bindings and components
- **packages/dockview-vue** - Vue bindings and components
- **packages/dockview-angular** - Angular bindings and components
- **packages/dockview-react** - Additional React utilities
- **packages/docs** - Documentation website (Docusaurus)
- **packages/dockview-core** - Core layout engine (TypeScript, framework-agnostic)
- **packages/dockview** - React bindings and components
- **packages/dockview-vue** - Vue bindings and components
- **packages/dockview-angular** - Angular bindings and components
- **packages/dockview-react** - Additional React utilities
- **packages/docs** - Documentation website (Docusaurus)
### Key Components
#### Core Architecture (dockview-core)
- **DockviewComponent** - Main container managing panels and groups
- **DockviewGroupPanel** - Container for related panels with tabs
- **DockviewPanel** - Individual content panels
- **Gridview/Splitview/Paneview** - Different layout strategies
- **API Layer** - Programmatic interfaces for each component type
- **DockviewComponent** - Main container managing panels and groups
- **DockviewGroupPanel** - Container for related panels with tabs
- **DockviewPanel** - Individual content panels
- **Gridview/Splitview/Paneview** - Different layout strategies
- **API Layer** - Programmatic interfaces for each component type
#### Framework Integration
- Framework-specific packages provide thin wrappers around core components
- React package uses HOCs and hooks for component lifecycle management
- Vue package provides Vue 3 composition API integration
- All frameworks share the same core serialization/deserialization logic
- Framework-specific packages provide thin wrappers around core components
- React package uses HOCs and hooks for component lifecycle management
- Vue package provides Vue 3 composition API integration
- All frameworks share the same core serialization/deserialization logic
#### Key Features
- Drag and drop with customizable drop zones
- Floating groups and popout windows
- Serialization/deserialization for state persistence
- Theming system with CSS custom properties
- Comprehensive API for programmatic control
- Drag and drop with customizable drop zones
- Floating groups and popout windows
- Serialization/deserialization for state persistence
- Theming system with CSS custom properties
- Comprehensive API for programmatic control
### Testing Strategy
- Jest with ts-jest preset for TypeScript support
- Testing Library for React component testing
- Coverage reporting with SonarCloud integration
- Each package has its own jest.config.ts extending root configuration
- Jest with ts-jest preset for TypeScript support
- Testing Library for React component testing
- Coverage reporting with SonarCloud integration
- Each package has its own jest.config.ts extending root configuration
### Build System
- Lerna for monorepo management
- Rollup for package bundling
- TypeScript for type checking and compilation
- Gulp for additional build tasks (SCSS processing)
- Lerna for monorepo management
- Rollup for package bundling
- TypeScript for type checking and compilation
- Gulp for additional build tasks (SCSS processing)
### Code Quality
- ESLint configuration extends recommended TypeScript rules
- Linting targets source files in packages/*/src/** (excludes tests, docs, node_modules)
- Configuration centralized in .eslintrc.js with ignore patterns
- Current rules focus on TypeScript best practices while allowing some flexibility
- Most linting issues require manual fixes (type specifications, unused variables, null assertions)
- ESLint configuration extends recommended TypeScript rules
- Linting targets source files in packages/\*/src/\*\* (excludes tests, docs, node_modules)
- Configuration centralized in .eslintrc.js with ignore patterns
- Current rules focus on TypeScript best practices while allowing some flexibility
- Most linting issues require manual fixes (type specifications, unused variables, null assertions)
## Development Notes
### Working with Packages
- Use Lerna commands for cross-package operations
- Each package can be built independently
- Core package must be built before framework packages
- Use workspaces for dependency management
- Use Lerna commands for cross-package operations
- Each package can be built independently
- Core package must be built before framework packages
- Use workspaces for dependency management
### Adding New Features
- Start with core package implementation
- Add corresponding API methods in api/ directory
- Create framework-specific wrappers as needed
- Update TypeDoc documentation
- Add tests in __tests__ directories
- Run `npm run lint` to check code quality before committing
- Start with core package implementation
- Add corresponding API methods in api/ directory
- Create framework-specific wrappers as needed
- Update TypeDoc documentation
- Add tests in **tests** directories
- Run `npm run lint` to check code quality before committing
### State Management
- Components use internal state with event-driven updates
- Serialization provides snapshot-based state persistence
- APIs provide reactive interfaces with event subscriptions
- Components use internal state with event-driven updates
- Serialization provides snapshot-based state persistence
- APIs provide reactive interfaces with event subscriptions

2
package.json
View File

@ -17,7 +17,7 @@
],
"scripts": {
"build": "lerna run build --scope '{dockview-core,dockview,dockview-vue,dockview-react}'",
"pack": "lerna run pack --scope '{dockview-core,dockview,dockview-vue,dockview-react}'",
"build:bundle": "lerna run build:bundle --scope '{dockview-core,dockview,dockview-vue,dockview-react}'",
"clean": "lerna run clean",
"docs": "node scripts/docs.mjs",
"lint": "eslint 'packages/*/src/**/*.{ts,tsx,js,jsx}'",

4
packages/dockview-angular/package.json
View File

@ -41,13 +41,13 @@
"README.md"
],
"scripts": {
"prepare": "rollup -c",
"build:bundle": "rollup -c",
"build:cjs": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.json --verbose --extendedDiagnostics",
"build:css": "gulp sass",
"build:esm": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.esm.json --verbose --extendedDiagnostics",
"build": "npm run build:cjs && npm run build:esm && npm run build:css",
"clean": "rimraf dist/ .build/ .rollup.cache/",
"prepublishOnly": "npm run rebuild && npm run test",
"prepublishOnly": "npm run rebuild && npm run build:bundle && npm run test",
"rebuild": "npm run clean && npm run build",
"test": "cross-env ../../node_modules/.bin/jest --selectProjects dockview",
"test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview --coverage"

4
packages/dockview-core/package.json
View File

@ -41,13 +41,13 @@
"README.md"
],
"scripts": {
"prepare": "rollup -c",
"build:bundle": "rollup -c",
"build:cjs": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.json --verbose --extendedDiagnostics",
"build:css": "gulp sass",
"build:esm": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.esm.json --verbose --extendedDiagnostics",
"build": "npm run build:cjs && npm run build:esm && npm run build:css",
"clean": "rimraf dist/ .build/ .rollup.cache/",
"prepublishOnly": "npm run rebuild && npm run test",
"prepublishOnly": "npm run rebuild && npm run build:bundle && npm run test",
"rebuild": "npm run clean && npm run build",
"test": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-core",
"test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-core --coverage"

4
packages/dockview-react/package.json
View File

@ -41,13 +41,13 @@
"README.md"
],
"scripts": {
"prepare": "rollup -c",
"build:bundle": "rollup -c",
"build:cjs": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.json --verbose --extendedDiagnostics",
"build:css": "node scripts/copy-css.js",
"build:esm": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.esm.json --verbose --extendedDiagnostics",
"build": "npm run build:cjs && npm run build:esm && npm run build:css",
"clean": "rimraf dist/ .build/ .rollup.cache/",
"prepublishOnly": "npm run rebuild && npm run test",
"prepublishOnly": "npm run rebuild && npm run build:bundle && npm run test",
"rebuild": "npm run clean && npm run build",
"test": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-react",
"test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-react --coverage"

2
packages/dockview-vue/package.json
View File

@ -46,7 +46,7 @@
"build:css": "node scripts/copy-css.js",
"build": "npm run build:js && npm run build:types && npm run build:css",
"clean": "rimraf dist/ .build/ .rollup.cache/",
"prepublishOnly": "npm run rebuild && npm run test",
"prepublishOnly": "npm run rebuild && npm run build:bundle && npm run test",
"rebuild": "npm run clean && npm run build",
"test": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-vue",
"test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-vue --coverage"

4
packages/dockview/package.json
View File

@ -41,13 +41,13 @@
"README.md"
],
"scripts": {
"prepare": "rollup -c",
"build:bundle": "rollup -c",
"build:cjs": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.json --verbose --extendedDiagnostics",
"build:css": "node scripts/copy-css.js",
"build:esm": "cross-env ../../node_modules/.bin/tsc --build ./tsconfig.esm.json --verbose --extendedDiagnostics",
"build": "npm run build:cjs && npm run build:esm && npm run build:css",
"clean": "rimraf dist/ .build/ .rollup.cache/",
"prepublishOnly": "npm run rebuild && npm run test",
"prepublishOnly": "npm run rebuild && npm run build:bundle && npm run test",
"rebuild": "npm run clean && npm run build",
"test": "cross-env ../../node_modules/.bin/jest --selectProjects dockview",
"test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview --coverage"