Directory tree:
.
├── package.json
├── src
│ ├── entrypoint.tsx
│ ├── index.html
│ └── ui
│ ├── App.tsx
│ └── shared
│ └── Reset.ts
├── start.sh
└── tsconfig.json
TypeScript's tsconfig.json sets paths to
Parcel's ~ module resolution convention
and baseUrl to src directory.
Parcel is given src/index.html as its input,
which references src/entrypoint.tsx.
All TypeScript files in src
may use the ~ non-relative import paths.
| import * as React from 'react' | |
| // routing, etc. | |
| import { Reset } from '~/ui/shared/Reset' | |
| export class App extends React.Component { | |
| public render() { | |
| return ( | |
| <div> | |
| <title>Dashboard</title> | |
| <Reset /> | |
| </div> | |
| ) | |
| } | |
| } |
| import * as React from 'react' | |
| import { render } from 'react-dom' | |
| // App wrapped with redux Provider, store, etc. | |
| import { App } from '~/ui/App' | |
| render( | |
| <App />, | |
| document.getElementById('root') | |
| ) |
| <!doctype html> | |
| <html> | |
| <body> | |
| <div id='root'></div> | |
| <script src='./entrypoint.tsx'></script> | |
| </body> | |
| </html> |
| { | |
| "dependencies": { | |
| "react": "^16.6.3", | |
| "react-dom": "^16.4.2", | |
| }, | |
| "devDependencies": { | |
| "@types/node": "^10.7.0", | |
| "@types/react": "^16.7.17", | |
| "@types/react-dom": "^16.0.7", | |
| "parcel-bundler": "1.10.0", | |
| "typescript": "^3.0.1" | |
| }, | |
| "scripts": { | |
| "build": "$(npm bin)/parcel build ./src/index.html", | |
| "start": "./start.sh" | |
| } | |
| } |
| #!/bin/bash | |
| set -e | |
| "$(npm bin)/tsc" --noEmit --watch & | |
| "$(npm bin)/parcel" ./src/index.html |
| { | |
| "compilerOptions": { | |
| "baseUrl": "./src", | |
| "paths": { | |
| "~/*": ["./*"] | |
| }, | |
| "typeRoots": ["node_modules/@types"] | |
| }, | |
| "include": ["src/**/*"] | |
| } |
Can someone help me please? I'm trying to do that but it's not working well.
Can someone help me please? I'm trying to do that but it's not working well.
I think your baseUrl needs to be as follows.
"baseUrl": "./src",
I'm not working on any TypeScript + Parcel projects at the moment but if someone has an updated working version, I can try to replicate locally and then update the original Gist for future folks.