# Webpack
* `yarn add @ddot/ddot-plugin-webpack -D`
## run
```javascript
$ yarn ddot dev // to development project
$ yarn ddot build // to build project
```
## guide
### html template
Create a new `src/pages/document.ejs`, if this file exists, it will be used as the default template
```markup
<%= htmlWebpackPlugin.options.title %>
```
## options
```typescript
export default {
plugins: [
[
'webpack',{...},
],
],
};
```
#### title
modify `document.title` for [html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin)
such as:
```javascript
title: 'DDot App',
```
#### outFileName
Configure the build `outFileName`
such as:
```javascript
outFileName: 'assets/[name].[contenthash]',
```
#### outputPath
Configure the build [outputPath](https://webpack.js.org/configuration/output/#output-path)
such as:
```javascript
outputPath: './dist',
```
#### chainWebpack
Extend or modify the webpack configuration via the API of `[webpack-chain](https://github.com/neutrinojs/webpack-chain)` obj
such as:
```javascript
chainWebpack(config) {
config
.entry('index')
.add('./src/index')
.end();
},
```
#### tsImportOption
add [options](https://github.com/Brooooooklyn/ts-import-plugin#options) for `ts-import-plugin`
such as:
```javascript
tsImportOption: [
{
libraryName: 'antd',
libraryDirectory: 'es',
style: true,
},
],
```
#### proxy
Configure the [proxy](https://github.com/fastify/fastify-http-proxy) property ,If you want to proxy requests to other servers,
* `key` map to `path`
* `key` map to `prefix`
* `target` map to `upstream`
* other property can auto to proxy property
such as:
```javascript
proxy: {
'/todos/1': {
target: 'http://jsonplaceholder.typicode.com/',
},
},
```
#### alias
Configure the resolve.alias property of webpack.
such as:
```javascript
alias: {
config: require('path').join(__dirname, './src/config'),
},
```
#### define
Passed to the code via the webP's DefinePlugin , the value is automatically handled by `JSON.stringify`.
such as:
```javascript
define: {
"process.env.TEST": 1,
},
```
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://ddot.gitbook.io/cli/extends/webpack.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.