Getting started with TypeScript, WebPack, and React
We’ve been integrating TypeScript more and more into our workflow at Lonely Planet.
I wanted to just quickly share how easy it is to get started working with TypeScript and Webpack!
It takes a very simple webpack.config…
module.exports = {
entry: "./src/index.tsx",
devtool: "source-map",
output: {
filename: "./dist/bundle.js",
},
resolve: {
extensions: [".ts", ".tsx", ".js", ".jsx"],
},
module: {
rules: [{
test: /\.tsx?$/,
loader: "ts-loader"
}],
},
};And a few npm installs…
"devDependencies": {
"@types/react": "^16.0.5",
"@types/react-dom": "^15.5.4",
"react": "^15.6.1",
"react-dom": "^15.6.1",
"ts-loader": "^2.3.4",
"typescript": "^2.5.2",
"webpack": "^3.5.5",
"webpack-dev-server": "^2.7.1"
}Then start writing TypeScript and React!
Full code of the starter at https://github.com/jcreamer898/typescript-webpack-react.
Subscribe to Jonathan Creamer
Get the latest posts delivered right to your inbox