Integrations
Webpack Integration
Last updated by
Harlan Wilton
in chore: deprecate integrations. Deprecated: This integration will be removed in v1.0. We recommend using the CLI or CI integrations instead. Learn more →
Introduction
The webpack integration provides Lighthouse auditing capabilities for webpack-based applications during development.
Install
yarn add -D @unlighthouse/webpack
npm install -D @unlighthouse/webpack
pnpm add -D @unlighthouse/webpack
Git ignore reports
Unlighthouse will save your reports in outputDir
(.unlighthouse
by default),
it's recommended you .gitignore these files.
.unlighthouse
Usage
To begin using Unlighthouse, you'll need to add extend your webpack configuration.
When you run your webpack app, it will give you the URL of client, only once you visit the client will Unlighthouse start.
webpack.config.js example
import Unlighthouse from '@unlighthouse/webpack'
export default {
// ...
plugins: [
Unlighthouse({
// config
}),
],
}
CJS example
const Unlighthouse = require('@unlighthouse/webpack')
export default {
// ...
plugins: [
Unlighthouse({
// config
}),
],
}
Configuration
You can either configure Unlighthouse via the plugin, or you can provide a config file in the root directory.
Example
import Unlighthouse from '@unlighthouse/webpack'
export default {
// ...
plugins: [
Unlighthouse({
scanner: {
// simulate a desktop device
device: 'desktop',
}
}),
],
}
Did this page help you?