parcel: Code splitting is not working

🐛 bug report

Code splitting

{
  "presets": [
    "env",
    "stage-2"
  ],
  "plugins": [
    "transform-runtime",
    "dynamic-import-node"
  ]
}

🤔 Expected Behavior

The build should contain one javascript file per page since I import them asynchronously.

😯 Current Behavior

There’s only one javascript file.

🔦 Context

I have a Vue application with webpack and I’m trying to migrate to parcel. My application has 5 pages that are lazy-loaded with const TheHome = () => import('../components/TheHome').

💻 Code Sample

I made an example that reproduce my problem. To try you can execute yarn dev or yarn build. https://github.com/maxirozay/test-parcel

🌍 Your Environment

Software	Version(s)
Parcel	1.6.2
Node	8.9.4
npm/Yarn	1.3.2
Operating System	linux (Solus)

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 11
Comments: 19 (1 by maintainers)

Commits related to this issue

investigating code splitting issues - likely a known bug. https://github.com/parcel-bundler/parcel/issues/905 — committed to glomotion/glo-2 by glomotion 6 years ago

Most upvoted comments

Closing. I believe this is because you have dynamic-import-node in your babelrc. This means babel will compile away the import() syntax before parcel sees it, and therefore no code splitting occurs. That babel plugin just compiles import() to require() which means it will be in a single bundle.

devongovett on Nov 4, 2018

@jeanfortheweb with your branch I get the error

(node:3568) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: ENOENT: no such file or directory, open '/path/node_modules/parcel-bundler/src/builtins/prelude.min.js'
(node:3568) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

The file prelude.min.js doesn’t exist but prelude.js does exist.

If I remove the code that use prelude.min.js it works but still no code splitting. I have one file for js, css, html and an empty map file.

maxirozay on Mar 1, 2018

@davibe check this issue , https://github.com/parcel-bundler/parcel/issues/1547

shenjo on Jan 7, 2020

@neculaesei I tried to update parcel to 1.9.7 and parcel-bundler to 1.9.7 and use your babelrc config and I get the error Cannot read property 'add' of undefined at JSPackager.addAsset...JSPackager.js:57:32.

maxirozay on Aug 23, 2018

I’m also running into this issue.

lifeiscontent on Mar 18, 2018