Support For Arrow Expressions in parcel watch

[rawkakani]

💬 RFC

🔦 Context

Hi I am trying to build a package with parcel and keep on getting
@parcel/packager-js: Asset was skipped or not found.

💻 Examples

after some tinkering I realised that i was using

const Component = ({children}) => {
    return(
        <div className={'hello'}>
            {children}
        </div>
    )
}

export default Component

over

function Component({ children }) {
    return (
        <div className={"hello"}>
            {children}
        </div>
    );
}
export default Component

I was curious to know if this was done on purpose, or there is a key I need to set

🌎 Environment

Software	Version(s)
Parcel	2.4.0
Node	v14.18.1
npm/Yarn	6.14.15
Operating System	12.13 (Mac OS)

[danieltroger]

Your first code snippet should definitely work and does for me in my environment. You're probably triggering some bug with your code, if you upload a simplified reproduction the devs might fix it.

[mischnic]

We've been trying to track down this Asset was skipped or not found bug for a while now but it's hard without a reproduction. So it would be great if you could provide one, including your package.json (because of the targets/main/module/... fields).

[rawkakani]

We've been trying to track down this Asset was skipped or not found bug for a while now but it's hard without a reproduction. So it would be great if you could provide one, including your package.json (because of the targets/main/module/... fields).

Hi @mischnic I am not sure exactly how to help you reproduce it all I have noticed is that when i use arrow functions over the t

Your first code snippet should definitely work and does for me in my environment. You're probably triggering some bug with your code, if you upload a simplified reproduction the devs might fix it.

🙈that was a simplified version

[rawkakani]

Component.js

const Component = ({children}) => {
    return(
        <div className={'hello'}>
            {children}
        </div>
    )
}

export default Component

index.js

import Component from './Component.js'

export {Component}

the above is what i was playing around with to get parcel watch to work

and the below is my package.json @mischnic I hope this helps

{
  "name": "sauveur.js",
  "version": "0.1.1",
  "description": "",
  "source": "sdk/index.js",
  "main": "core/index.js",
  "files": [
    "core"
  ],
  "scripts": {
    "start": "parcel index.html --dist-dir public ",
    "server": "deno run --allow-net --allow-env bridge/server.js",
    "build": "parcel build index.html --dist-dir public",
    "build:package": "parcel build --no-cache",
    "deploy": "dfx deploy --network ic sauveur",
    "ic:install": "dfx canister --network ic install sauveur --mode reinstall ",
    "deploy-backend": "dfx deploy --network ic sauveur",
    "test": "echo \"Error: no test specified\" && exit 1",
    "watch": "parcel watch --no-cache",
    "playground": "parcel ./playground/index.html --dist-dir playground-dist --no-cache "
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@dfinity/agent": "^0.10.3",
    "@dfinity/candid": "^0.10.3",
    "@dfinity/principal": "^0.10.3",
    "@js-temporal/polyfill": "^0.3.0",
    "@azure/storage-blob": "latest",
    "animate.css": "^4.1.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-router-dom": "^6.2.1",
    "@parcel/transformer-react-refresh-wrap": "^2.4.1"
  },
  "devDependencies": {
    "autoprefixer": "^10.4.0",
    "eslint": "^8.10.0",
    "eslint-plugin-react": "^7.29.2",
    "eslint-plugin-react-hooks": "^4.3.0",
    "parcel": "^2.4.1",
    "postcss": "^8.4.5",
    "postcss-modules": "^4.3.1",
    "tailwindcss": "^3.0.23",
    "@parcel/transformer-css": "^2.4.1"
  },
  "alias": {
    "local-service": "./sdk/services",
    "assets": "./assets",
    "studio": "./sdk/studio"
  },
  "@parcel/transformer-css": {
    "cssModules": false
  }
}

the exact error I get below after running npm run watch

@parcel/packager-js: Asset was skipped or not found.

  AssertionError [ERR_ASSERTION]: Asset was skipped or not found.
  at ScopeHoistingPackager.getSymbolResolution
  (/Users/codebender/codebenderhq/sauveur/node_modules/@parcel/packager-js/lib/ScopeHoistingPackager.js:732:29)
  at
  /Users/codebender/codebenderhq/sauveur/node_modules/@parcel/packager-js/lib/ScopeHoistingPackager.js:836:31
  at Array.map (<anonymous>)
  at ScopeHoistingPackager.buildAssetPrelude
  (/Users/codebender/codebenderhq/sauveur/node_modules/@parcel/packager-js/lib/ScopeHoistingPackager.js:835:37)
  at ScopeHoistingPackager.buildAsset
  (/Users/codebender/codebenderhq/sauveur/node_modules/@parcel/packager-js/lib/ScopeHoistingPackager.js:398:48)
  at ScopeHoistingPackager.visitAsset
  (/Users/codebender/codebenderhq/sauveur/node_modules/@parcel/packager-js/lib/ScopeHoistingPackager.js:357:17)
  at
  /Users/codebender/codebenderhq/sauveur/node_modules/@parcel/packager-js/lib/ScopeHoistingPackager.js:456:56
  at String.replace (<anonymous>)
  at ScopeHoistingPackager.buildAsset
  (/Users/codebender/codebenderhq/sauveur/node_modules/@parcel/packager-js/lib/ScopeHoistingPackager.js:420:19)
  at ScopeHoistingPackager.visitAsset
  (/Users/codebender/codebenderhq/sauveur/node_modules/@parcel/packager-js/lib/ScopeHoistingPackager.js:357:17)

[safouanmatmati]

We've been trying to track down this Asset was skipped or not found bug for a while now but it's hard without a reproduction. So it would be great if you could provide one, including your package.json (because of the targets/main/module/... fields).

Maybe this comment on a related issue could help.

[rawkakani]

We've been trying to track down this Asset was skipped or not found bug for a while now but it's hard without a reproduction. So it would be great if you could provide one, including your package.json (because of the targets/main/module/... fields).

Maybe this comment on a related issue could help.

Yeah i tried the solutions there before I came here 😔

[mischnic]

So this particular error will be fixed by the linked PR, but when building a webapp this should never have occured anyway.

  "source": "sdk/index.js",
  "main": "core/index.js",
  "scripts": {
    "start": "parcel index.html --dist-dir public ",

You probably want to add "targets": { "main": false } to make Parcel ignore the main field. https://parceljs.org/features/targets/#library-targets