You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/guides/typescript.mdx
+40Lines changed: 40 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,6 +9,7 @@ contributors:
9
9
- EugeneHlushko
10
10
- chenxsan
11
11
- snitin315
12
+
- deerawan
12
13
---
13
14
14
15
T> This guide stems from the [_Getting Started_](/guides/getting-started/) guide.
@@ -94,6 +95,45 @@ module.exports = {
94
95
95
96
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.
96
97
98
+
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.
99
+
100
+
```bash
101
+
npm install --save-dev ts-node @types/webpack
102
+
```
103
+
104
+
`ts-node` is required by webpack to load the configuration in Typescript. `@types/webpack` is an optional to give typing information for webpack config.
105
+
106
+
Let's see the Typescript version of webpack config file.
107
+
108
+
**webpack.config.ts**
109
+
110
+
```ts
111
+
import*aspathfrom'path';
112
+
import { Configuration } from'webpack';
113
+
114
+
const config:Configuration= {
115
+
entry: './src/index.ts',
116
+
module: {
117
+
rules: [
118
+
{
119
+
test:/\.tsx?$/,
120
+
use: 'ts-loader',
121
+
exclude:/node_modules/,
122
+
},
123
+
],
124
+
},
125
+
resolve: {
126
+
extensions: ['.tsx', '.ts', '.js'],
127
+
},
128
+
output: {
129
+
filename: 'bundle.js',
130
+
path: path.resolve(__dirname, 'dist'),
131
+
},
132
+
};
133
+
134
+
exportdefaultconfig;
135
+
```
136
+
97
137
Now lets change the import of `lodash` in our `./index.ts` due to the fact that there is no default export present in `lodash` definitions.
0 commit comments