Skip to content

docs (typescript): add guide for webpack config TS #6105

New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

deerawan
Copy link

@deerawan deerawan commented Apr 25, 2022

Add a guide on how to use webpack configuration in Typescript webpack.config.ts.

Fixes #6106

@linux-foundation-easycla
Copy link

linux-foundation-easycla bot commented Apr 25, 2022

CLA Signed

The committers listed above are authorized under a signed CLA.

  • ✅ login: deerawan / name: Budi Irawan (1abf384)

@vercel
Copy link

vercel bot commented Apr 25, 2022

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
webpack-js-org ✅ Ready (Inspect) Visit Preview Apr 25, 2022 at 3:59AM (UTC)

Regarding webpack configuration, instead of using Javascript for `webpack.config.js`, we could use the Typescript version `webpack.config.ts`. This is possible by installing some packages below.

```bash
npm install --save-dev ts-node @types/webpack
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No need to install @types/webpack, webpack v5 has built-in types

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's right! I'll remove this part. I was putting it here because I ran this guide with webpack4, but I guess this always targets the latest version which is webpack5. 👍

Add a guide on how to use webpack configuration in Typescript  `webpack.config.ts`.

Fixes webpack#6106
@chenxsan
Copy link
Member

Actually we did have a guide here https://webpack.js.org/configuration/configuration-languages/#typescript, so maybe we can just add a link to that in this page?

@@ -94,6 +95,45 @@ module.exports = {

This will direct webpack to _enter_ through `./index.ts`, _load_ all `.ts` and `.tsx` files through the `ts-loader`, and _output_ a `bundle.js` file in our current directory.

Regarding webpack configuration, instead of using Javascript for `webpack.config.js`, we could use the Typescript version `webpack.config.ts`. This is possible by installing `ts-node`.

```bash
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

probably can have a link somewhere to link to https://webpack.js.org/configuration/configuration-languages/#typescript

which explains on using typescript for configuring webpack

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Doc: Add a section for webpack.config.ts
4 participants