Configuration
Basic Configuration
Configure Now.js during initialization with the init() method
await Now.init({
// Core settings
debug: true,
environment: 'development',
strictMode: true,
// Application info
app: {
name: 'My Application',
version: '1.0.0',
description: 'My awesome web app'
},
// Resource paths
resources: {
components: ['header', 'footer'],
plugins: ['syntax-highlighter']
}
});
Configuration Options
Core Settings
| Option | Type | Default | Description |
|---|---|---|---|
debug |
boolean | false |
Enable debug mode for detailed logging |
environment |
string | 'production' |
Environment setting ('development' or 'production') |
strictMode |
boolean | true |
Enable strict mode for stricter error checking |
Security Settings
| Option | Type | Default | Description |
|---|---|---|---|
security.csrf |
boolean | true |
Enable CSRF protection |
security.xss |
boolean | true |
Enable XSS protection |
security.validateInput |
boolean | true |
Enable input validation |
Router Configuration
router: {
mode: 'history', // 'history' or 'hash'
base: '/',
routes: {
'/': {
template: '/templates/home.html',
title: 'Home'
},
'/about': {
template: '/templates/about.html',
title: 'About Us'
}
},
notFound: {
template: '/templates/404.html',
title: 'Page Not Found'
}
}
State Management
state: {
// Enable state persistence
persistence: {
enabled: true,
key: 'app_state',
storage: 'local', // 'local' or 'session'
encrypt: false
},
// State history for debugging
history: {
enabled: true,
maxSize: 50
}
}
Internationalization (i18n)
i18n: {
defaultLocale: 'en',
fallbackLocale: 'en',
availableLocales: ['en', 'th'],
loadPath: '/locales/{locale}.json',
persistent: true
}
Theme Configuration
theme: {
default: 'light',
available: ['light', 'dark'],
storage: 'local',
systemPreference: true, // Follow system dark mode preference
variables: {
light: {
'--color-background': '#ffffff',
'--color-text': '#000000'
},
dark: {
'--color-background': '#1a1a1a',
'--color-text': '#ffffff'
}
}
}
Performance Settings
performance: {
monitoring: true,
metrics: true,
warnings: true,
errorReporting: true,
monitoring: {
sampleRate: 0.1,
maxEntries: 100
}
}
Development Tools
devTools: {
enabled: true,
performance: true,
logger: true,
inspector: true
}
Environment Variables
Now.js also supports environment-specific configuration
// config.development.js
{
debug: true,
devTools: {
enabled: true
}
}
// config.production.js
{
debug: false,
devTools: {
enabled: false
},
security: {
validateInput: true,
sanitizeOutput: true
}
}
Dynamic Configuration
Update configuration at runtime
// Update single option
Now.setConfig('debug', true);
// Update multiple options
Now.setConfig({
debug: true,
strictMode: false
});
// Get current configuration
const config = Now.getConfig();
console.log(config.debug);
Best Practices
Security
- Always enable CSRF protection in production
- Use strict mode for better error catching
- Enable input validation and sanitization
Performance
- Disable debug mode in production
- Enable performance monitoring selectively
- Use appropriate cache settings
Development
- Use environment-specific configurations
- Enable detailed logging in development
- Utilize development tools for debugging