8.0 KiB
8.0 KiB
Update dependencies in your Odoo PWA project to latest compatible versions.
What this command does:
- Checks for outdated dependencies
- Updates packages to latest versions
- Tests the application after updates
- Fixes breaking changes if needed
- Updates lock files
- Verifies everything still works
Prerequisites:
- Current directory is an Odoo PWA project
- Git repository (recommended for easy rollback)
- Latest npm installed
Update Strategy
Safe Update (Recommended)
Updates to latest compatible versions within semver ranges.
npm update
Major Update (Requires testing)
Updates to latest versions including major releases.
npm outdated # See what's outdated
npm update # Update minor/patch
npx npm-check-updates -u # Update majors
npm install
Steps:
1. Check Current Status
# See current versions
npm list --depth=0
# See outdated packages
npm outdated
2. Create Backup
# Commit current state
git add .
git commit -m "Pre-dependency update checkpoint"
# Or backup package files
cp package.json package.json.backup
cp package-lock.json package-lock.json.backup
3. Update Dependencies
Minor/Patch Updates (Safe)
npm update
npm install
Major Updates (Test carefully)
# Install npm-check-updates if needed
npm install -g npm-check-updates
# Preview updates
ncu
# Update package.json
ncu -u
# Install new versions
npm install
4. Framework-Specific Updates
SvelteKit
# Update Svelte + SvelteKit
npm update @sveltejs/kit @sveltejs/adapter-static
npm update svelte
# Check for breaking changes
# https://github.com/sveltejs/kit/blob/master/CHANGELOG.md
React
# Update React
npm update react react-dom
# Update related packages
npm update @types/react @types/react-dom
Vue
# Update Vue
npm update vue
# Update related packages
npm update @vitejs/plugin-vue
5. Update Build Tools
# Update Vite
npm update vite
# Update PWA plugin
npm update vite-plugin-pwa @vite-pwa/sveltekit
6. Test Everything
Run Development Server
npm run dev
Check:
- ✅ Server starts without errors
- ✅ App loads correctly
- ✅ No console errors
- ✅ All routes work
Test Core Functionality
- ✅ Odoo connection works
- ✅ Data loads from cache
- ✅ Sync works
- ✅ CRUD operations work
- ✅ Offline mode works
Build for Production
npm run build
Check:
- ✅ Build completes without errors
- ✅ No warnings about deprecations
- ✅ Bundle size is reasonable
Preview Production Build
npm run preview
Test the same functionality in production mode.
7. Run Connection Test
# If /test-connection command is available
/test-connection
8. Commit Changes
git add package.json package-lock.json
git commit -m "Update dependencies to latest versions"
Common Issues & Solutions
Issue: Build fails after update
Solution:
# Revert updates
git checkout package.json package-lock.json
npm install
# Try updating one package at a time
npm update vite
npm run build # Test
npm update @sveltejs/kit
npm run build # Test
# Continue one by one
Issue: TypeScript errors
Solution:
# Update TypeScript
npm update typescript
# Update type definitions
npm update @types/node
# Regenerate tsconfig
npx tsc --init
Issue: Import errors
Solution:
// Old import might be:
import { foo } from 'package';
// New import might be:
import { foo } from 'package/foo';
// Check package's CHANGELOG for migration guide
Issue: Service Worker errors
Solution:
# Update PWA plugin
npm update vite-plugin-pwa
# Check configuration
# vite.config.js
VitePWA({
// Update config as needed
})
Issue: Peer dependency warnings
Solution:
# Install peer dependencies
npm install <missing-peer-dep>
# Or use --force (not recommended)
npm install --force
Breaking Changes to Watch For
Vite 5+
- May require Node 18+
- ESM-only packages
- Updated config format
SvelteKit 2+
- Svelte 5 syntax (runes)
- Updated adapter config
- New routing conventions
React 19+
- New JSX transform
- Updated hooks behavior
- Server components
Vue 3.4+
- New compiler optimizations
- Updated Composition API
- Better TypeScript support
Update Checklist
After updating, verify:
□ npm run dev works
□ npm run build succeeds
□ npm run preview works
□ No console errors
□ Odoo connection works
□ Data syncs correctly
□ CRUD operations work
□ Offline mode works
□ Service worker registered
□ Tests pass (if any)
□ No TypeScript errors
□ No ESLint warnings
□ Documentation updated
Selective Updates
Update Only Production Dependencies
npm update --prod
Update Specific Package
npm update vite
npm update @sveltejs/kit
Update to Specific Version
npm install vite@5.0.0
npm install svelte@5.0.0
Keep Package at Current Version
// package.json
{
"dependencies": {
"some-package": "1.2.3" // No ^ or ~ = exact version
}
}
Best Practices
1. Update Regularly
- Check weekly for security updates
- Update monthly for feature updates
- Test before deploying
2. Read Changelogs
- Check CHANGELOG.md for breaking changes
- Review migration guides
- Test thoroughly
3. Update One Category at a Time
# 1. Framework
npm update svelte @sveltejs/kit
# 2. Build tools
npm update vite
# 3. Dependencies
npm update # All others
4. Keep Lock Files
- Commit
package-lock.json - Ensure consistent installs
- Track exact versions
5. Test in Staging
- Deploy to staging first
- Test all functionality
- Then deploy to production
Security Updates
Check for Vulnerabilities
npm audit
Fix Automatically
npm audit fix
Fix with Breaking Changes
npm audit fix --force
Review Details
npm audit --json
Automated Updates (Optional)
Using Dependabot (GitHub)
Create .github/dependabot.yml:
version: 2
updates:
- package-ecosystem: "npm"
directory: "/"
schedule:
interval: "weekly"
open-pull-requests-limit: 10
Using Renovate
Create renovate.json:
{
"extends": ["config:base"],
"schedule": ["before 10am on monday"]
}
Rollback Plan
If Something Breaks
Quick Rollback
git checkout package.json package-lock.json
npm install
Restore from Backup
cp package.json.backup package.json
cp package-lock.json.backup package-lock.json
npm install
Git Reset
git reset --hard HEAD~1
npm install
After Update
Update Documentation
- Note any breaking changes
- Update README if needed
- Document new features used
Notify Team
- Share what was updated
- Note any changes in behavior
- Update staging/production
Monitor Production
- Watch error logs
- Check performance metrics
- Monitor user reports
Example prompts to use this command:
/update-deps- Update all dependencies- User: "Update my dependencies"
- User: "Check for package updates"
- User: "My packages are outdated"
Related Commands:
/fix-sync- If sync breaks after update/test-connection- Verify Odoo still works/troubleshoot- Fix issues after update/optimize- Check for optimizations after update
Quick Update Script
Save as update.sh:
#!/bin/bash
echo "Backing up..."
cp package.json package.json.backup
cp package-lock.json package-lock.json.backup
echo "Checking for updates..."
npm outdated
echo "Updating..."
npm update
echo "Installing..."
npm install
echo "Testing..."
npm run build
if [ $? -eq 0 ]; then
echo "✅ Build successful!"
echo "Run: npm run dev to test"
else
echo "❌ Build failed! Rolling back..."
cp package.json.backup package.json
cp package-lock.json.backup package-lock.json
npm install
fi
Usage:
chmod +x update.sh
./update.sh