vite-plugin-mock-data
v4.0.6
Published
Provides a simple way to mock data.
Downloads
49
Maintainers
Readme
vite-plugin-mock-data
Provides a simple way to mock data. Vite >= 3.1
Installation
npm install vite-plugin-mock-data --save-dev
Options
cwd
- Default:process.cwd()
.isAfter
- Iftrue
, these mock routes is matched after internal middlewares are installed.mockAssetsDir
- Specify the directory to define mock assets.mockRouterOptions
- Initial options offind-my-way
mockRoutes
- Initial list of mock routes that should be added to the dev server.mockRoutesDir
- Specify the directory to define mock routes that should be added to the dev server.
Usage
Specify the directory to define mock assets
import { defineConfig } from 'vite';
import mockData from 'vite-plugin-mock-data';
export default defineConfig({
plugins: [
mockData({
mockAssetsDir: './mockAssets'
})
]
});
.
├── mockAssets
│ ├── test.zip
│ └── test.json
fetch('/test.json')
.then(res => res.json())
.then((json) => {
console.log(json);
});
<a class="download" href="./test.zip">Download</a>
add mock routes to the dev server
import { defineConfig } from 'vite';
import mockData from 'vite-plugin-mock-data';
export default defineConfig({
plugins: [
mockData({
mockRoutes: {
'/hello': 'hello',
'/hello2'(req, res) {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/html');
res.end('hello2');
},
'/hello3': {
handler(req, res) {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/html');
res.end('hello3');
}
},
'/json': {
handler: { hello: 1 }
},
'/package.json': {
file: './package.json'
}
}
})
]
});
fetch('/package.json')
.then(res => res.json())
.then((json) => {
console.log(json);
});
Specify the directory to add mock routes to the dev server
import { defineConfig } from 'vite';
import mockData from 'vite-plugin-mock-data';
export default defineConfig({
plugins: [
mockData({
mockRoutesDir: './mock'
})
]
});
.
├── mock
│ └── test.js
module.exports = {
'/hello': 'hello',
'/hello2'(req, res) {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/html');
res.end('hello2');
},
'/hello3': {
handler(req, res) {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/html');
res.end('hello3');
}
},
'/json': {
handler: { hello: 1 }
},
'/package.json': {
file: './package.json'
}
};
fetch('/package.json')
.then(res => res.json())
.then((json) => {
console.log(json);
});