# Option chunks Html Webpack Plugin (ok)

&#x20;Ở phần trên lúc tạo ra hai trang dist/index.html và dist/about.html thì cả hai trang này đều load chung một file dist/main.js. Để tách riêng từng trang load từng file JS ta tạo key entry và sử dụng chunks để thêm vào<br>

```

const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
  entry: {
    homepage: ['./src/index.js', './src/slider.js'],
    aboutpage: ['./src/about.js']
  },
  output: {
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist')
  },
  plugins: [
    new HtmlWebpackPlugin({
      title: 'Trang chủ',
      filename: 'index.html',
      template: './src/index.html',
      chunks: ['homepage']
    }),  
    new HtmlWebpackPlugin({
      title: 'Về chúng tôi',
      filename: 'about.html',
      template: './src/about-dev.html',
      chunks: ['aboutpage']
    })
  ]
}
```

Với cấu hình trên thì ta có hai trang HTML load hai file JS riêng biệt.\
Trang dist/index.html load file dist/homepage.js là kết hợp của hai file src/index.js và src/slider.js\
Trang dist/about.html load file dist/aboutpage.js là code file src/about.js


---

# 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://javascriptuse.gitbook.io/javascript/advanced/option-chunks-html-webpack-plugin-ok.md?ask=<question>
```

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.