처음부터 설치한다면
- snippet.shell
$ yarn init -y $ yarn add -D typescript @types/react @zeit/next-typescript $ yarn add next react react-dom
with-typescript
- snippet.shell
yarn create next-app --example with-typescript with-typescript-app
.babelrc
- snippet.javascript
{ "presets": [ "next/babel", "@zeit/next-typescript/babel" ] }
next.config.js
- snippet.javascript
const withTypescript = require('@zeit/next-typescript') module.exports = withTypescript()
tscofig.json
- snippet.javascript
{ "compileOnSave": false, "compilerOptions": { "target": "esnext", "module": "esnext", "jsx": "preserve", "allowJs": true, "moduleResolution": "node", "allowSyntheticDefaultImports": true, "noUnusedLocals": true, "noUnusedParameters": true, "removeComments": false, "preserveConstEnums": true, "sourceMap": true, "skipLibCheck": true, "baseUrl": ".", "typeRoots": [ "./node_modules/@types" ], "lib": [ "dom", "es2015", "es2016" ] } }
package.json
- snippet.javascript
{ "name": "typescript-nextjs", "version": "1.0.0", "main": "index.js", "license": "MIT", "devDependencies": { "@types/react": "^16.4.13", "typescript": "^3.0.3" }, "dependencies": { "@zeit/next-typescript": "^1.1.0", "next": "^6.1.2", "react": "^16.5.0", "react-dom": "^16.5.0" }, "scripts": { "dev": "next", "build": "next build", "start": "next start" } }
with styled-components
- snippet.shell
yarn add styled-componenets @material-ui/core @material-ui/icons yarn add @types/styled-components
_document.tsx
_app.tsx
with mobx
- snippet.shell
yarn add -D babel-plugin-transform-class-properties babel-plugin-transform-decorators-legacy yarn add mobx mobx-react https://github.com/fdidron/mobx-next-example/blob/master/components/hoc/page.js