Parcel: Version 1.10.1 breaks absolute paths in typescript

Created on 27 Sep 2018  路  16Comments  路  Source: parcel-bundler/parcel

馃悰 bug report

When updating to version 1.10.0 of parcel-bundler from 1.9.7, absolute paths in typescript are no longer working.

馃帥 Configuration (.babelrc, package.json, cli command)

// package.json
{
  "name": "register",
  "version": "1.0.0",
  "main": "src/index.js",
  "private": true,
  "license": "MIT",
  "scripts": {
    "start": "parcel public/index.html",
    "build": "parcel build public/index.html",
    "lint": "tslint -c tslint.json --project tsconfig.json 'src/**/*.ts?(x)'",
    "precommit": "lint-staged"
  },
  "devDependencies": {
    "@types/react": "^16.4.14",
    "@types/react-document-title": "^2.0.3",
    "@types/react-dom": "^16.0.7",
    "@types/react-router-dom": "^4.3.1",
    "husky": "^0.14.3",
    "lint-staged": "^7.2.2",
    "parcel-bundler": "^1.10.1",
    "parcel-plugin-typescript": "^1.0.0",
    "prettier": "^1.14.2",
    "tslint": "^5.11.0",
    "tslint-config-airbnb": "^5.11.0",
    "tslint-config-prettier": "^1.15.0",
    "tslint-react": "^3.6.0",
    "typescript": "^3.0.3"
  },
  "dependencies": {
    "antd": "^3.9.2",
    "date-fns": "^1.29.0",
    "firebase": "^5.5.0",
    "react": "^16.5.1",
    "react-document-title": "^2.0.3",
    "react-dom": "^16.5.1",
    "react-router-dom": "^4.3.1",
    "styled-components": "^3.4.6"
  },
  "lint-staged": {
    "*.{ts,tsx}": [
      "tslint -c tslint.json --project tsconfig.json 'src/**/*.ts?(x)'",
      "git add"
    ]
  }
}

// tsconfig.json
{
  "compilerOptions": {
    "module": "esnext",
    "target": "es5",
    "lib": ["es7", "dom", "esnext.asynciterable"],
    "sourceMap": true,
    "jsx": "react",
    "moduleResolution": "node",
    "rootDir": "src",
    "forceConsistentCasingInFileNames": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "suppressImplicitAnyIndexErrors": true,
    "noUnusedLocals": true,
    "allowSyntheticDefaultImports": true,
    "skipLibCheck": true,
    "baseUrl": "src", // This is what allows the absolute paths to work
    "paths": {
      "@styled": ["utils/styled"]
    },
    "types": ["node"]
  }
}

Directory structure

screen shot 2018-09-27 at 7 14 33 am

馃 Expected Behavior

When running parcel index.html, it should resolve the absolute paths and run the app. Since my baseUrl is set to src in tsconfig.json, then it should resolve the path as src/config/firebase

馃槸 Current Behavior

Parcel displays an error in which it's unable to resolve the path.
register/src/index.tsx:5:7: Cannot resolve dependency 'config/firebase'

馃拋 Possible Solution

Not sure what changes occurred in the 1.10.0 release, but the app was working fine using 1.9.4.
Remove my absolute path and use a relative path.

馃敠 Context

It affects me as i'm no longer able to build my app. Here's link to source code https://github.com/iRoachie/register

馃捇 Code Sample

// index.tsx
import React from 'react';
import ReactDOM from 'react-dom';
import 'antd/dist/antd.css';

import 'config/firebase';

import Shell from './containers/Shell';

ReactDOM.render(<Shell />, document.getElementById('root'));

馃實 Your Environment

| Software | Version(s) |
| ---------------- | ---------- |
| Parcel | 1.10.1 |
| Node | 8.11.4 |
| npm/Yarn | yarn 1.9.4 |
| Operating System | mac os 10.14 |

Bug Stale TypeScript

Most helpful comment

Same happens to me when switching from 1.9.7 to 1.10.1.

Yet I have an "@" character prepended to the paths, hence I got a different error message:
Failed to install @src/[...]

I'd assume that the bundler tries to install the missing dependency via yarn, instead of resolving it with the specified paths in the tsconfig.json file.

All 16 comments

Not sure what would cause this as TS hasn't changed for about half a year.

It might be because we upgraded to TS 3?

Not sure, as you see in my package.json, I'm also using typescript 3^

Did it work previous to 1.10?

Yea the project is currently on 1.9.7

Same happens to me when switching from 1.9.7 to 1.10.1.

Yet I have an "@" character prepended to the paths, hence I got a different error message:
Failed to install @src/[...]

I'd assume that the bundler tries to install the missing dependency via yarn, instead of resolving it with the specified paths in the tsconfig.json file.

I'm also getting the issue. It occurs even if auto install dependencies is turned off.

I believe it has to do with a change to Resolver.js (which one I'm not sure) between 1.9.7 and 1.10.1.

This one maybe? https://github.com/parcel-bundler/parcel/commit/a769fa7462d0d4258a26b82caa08afcd04979f5e#diff-f90b0caefa8028ff5ec8f2f2c2e6e39dL150

I'll try version [email protected] and see if the issue occurs there tomorrow.

EDIT: No dice :(

Hey @DeMoorJasper, any news on this issue?

@ThomasK33 Not sure, TS asset handling hasn't changed in 1.10, so it's not really easy to pinpoint it.

If anyone wants to dig into this, definitely feel free to do so.

Maybe some problems happened between [email protected] and parcel-plugin-typescript ?

@nnecec I think so too.

@nnecec if this is truly a parcel-plugin-ts bug it鈥檚 probably a good idea to move it to that repo.

In that case this issue should also be closed

Sent with GitHawk

I also think that could be a compatibility issue between parcel-plugin-typescript and [email protected].
Parcel doesn't know anything about baseUrl and paths. If it sees an absolute module path (without "./" or "../" , "/" would indicate absolute path relative to the project root for parcel, "~" would be the package root ), it goes through the normal node lookup and tries to find the package innode_modules (correct me if Im wrong).
The plugin claims to do the job:

Path mappings:
Rewriting your import on the fly accordingly to your paths and baseUrl compiler options.

, could be broken.

(also still looking for an optimal solution to use typescript mappings)

cc. @fathyb any idea?

Any update?

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 14 days if no further activity occurs.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

philipodev picture philipodev  路  3Comments

Niggler picture Niggler  路  3Comments

dotdash picture dotdash  路  3Comments

jzimmek picture jzimmek  路  3Comments

davidnagli picture davidnagli  路  3Comments