[0.18.2] Module not found: Error: Can't resolve './dist/cpexcel.js' #2530

New Issue

2022-02-22T03:12:29Z

kingyue737 commented

2022-02-22 03:12:29 +00:00

(Migrated from github.com)

I added alias in my webpack configuration to reduce bundle size.

configureWebpack: {
    resolve: {
      alias: {
        xlsx$: 'xlsx/dist/xlsx.mini.min',
      },
    },

After upgrade from 0.17 to 0.18.2, it shows the following error:
Module not found: Error: Can't resolve './dist/cpexcel.js' in 'D:\project\node_modules\xlsx\dist'

I added alias in my webpack configuration to reduce bundle size. ``` configureWebpack: { resolve: { alias: { xlsx$: 'xlsx/dist/xlsx.mini.min', }, }, ``` After upgrade from 0.17 to 0.18.2, it shows the following error: `Module not found: Error: Can't resolve './dist/cpexcel.js' in 'D:\project\node_modules\xlsx\dist'`

kingyue737 commented

2022-02-22 04:49:32 +00:00

(Migrated from github.com)

I've removed the alias to try tree shaking mentioned by docs. But it seems that the bundle size increases a lot.

Here is the bundle size when I use xlsx.mini.min v0.17:

After I upgrade to v0.18.2:

Here is how I import xlsx:

import { read, utils, writeFileXLSX } from 'xlsx'
const XLSX = { read, utils, writeFileXLSX }

Then I tried the following alias:

configureWebpack: {
    resolve: {
      alias: {
        xlsx$: 'xlsx/xlsx.mini',
      },
    },

The bundle becomes even larger:

What is the right way to reduce bundle size in current version? Many thanks for any help!

I've removed the alias to try tree shaking mentioned by docs. But it seems that the bundle size increases a lot. Here is the bundle size when I use xlsx.mini.min v0.17: ![image](https://user-images.githubusercontent.com/40021217/155064477-e8b86c95-06a7-466e-bb00-1edc44f9fe53.png) After I upgrade to v0.18.2: ![image](https://user-images.githubusercontent.com/40021217/155064882-3c524cb1-6895-4be7-9a6e-f2c966ce010e.png) Here is how I import xlsx: ``` import { read, utils, writeFileXLSX } from 'xlsx' const XLSX = { read, utils, writeFileXLSX } ``` Then I tried the following alias: ``` configureWebpack: { resolve: { alias: { xlsx$: 'xlsx/xlsx.mini', }, }, ``` The bundle becomes even larger: ![Screenshot 2022-02-22 123807](https://user-images.githubusercontent.com/40021217/155064399-798f5279-55c5-41fc-954d-867c2e2d1948.jpg) What is the right way to reduce bundle size in current version? Many thanks for any help!

kingyue737 commented

2022-02-22 07:13:46 +00:00

(Migrated from github.com)

It seems that this package does not include the sideEffects property mentioned by webpack docs, which is required to enable tree shaking.

It seems that this package does not include the `sideEffects` property mentioned by webpack docs, which is required to enable tree shaking.

SheetJSDev commented

2022-02-23 22:04:51 +00:00

(Migrated from github.com)

The mini build is not exactly equivalent to the ESM build after tree-shaking.

For example, XLSB read support is always omitted in the mini build but will be included if you import read or readFile with the ESM build. In theory the parser could be split up into separate modules with dynamic import, but until then the ESM build pulls in all read codecs if read is imported.

Note: For writing, writeFileXLSX and writeXLSX is specific to the XLSX format, which helps avoid pulling in the other write codecs.

.

That said, we should update the docs for the other build systems. Are you using Webpack directly or through something like create-react-app?

The mini build is not exactly equivalent to the ESM build after tree-shaking. For example, XLSB read support is always omitted in the mini build but will be included if you import `read` or `readFile` with the ESM build. In theory the parser could be split up into separate modules with dynamic `import`, but until then the ESM build pulls in all read codecs if `read` is imported. Note: For writing, `writeFileXLSX` and `writeXLSX` is specific to the `XLSX` format, which helps avoid pulling in the other write codecs. . That said, we should update the docs for the other build systems. Are you using Webpack directly or through something like create-react-app?

kingyue737 commented

2022-02-24 03:09:45 +00:00

(Migrated from github.com)

The mini build is not exactly equivalent to the ESM build after tree-shaking.

For example, XLSB read support is always omitted in the mini build but will be included if you import read or readFile with the ESM build. In theory the parser could be split up into separate modules with dynamic import, but until then the ESM build pulls in all read codecs if read is imported.

Note: For writing, writeFileXLSX and writeXLSX is specific to the XLSX format, which helps avoid pulling in the other write codecs.

.

That said, we should update the docs for the other build systems. Are you using Webpack directly or through something like create-react-app?

I've tried
import { read, utils, writeFileXLSX } from 'xlsx'
then
import { read, utils, writeFile } from 'xlsx'

However, the bundle size did not change (which should augment if tree shaking works).
I'm using webpack5 through vue-cli5.

> The mini build is not exactly equivalent to the ESM build after tree-shaking. > > For example, XLSB read support is always omitted in the mini build but will be included if you import `read` or `readFile` with the ESM build. In theory the parser could be split up into separate modules with dynamic `import`, but until then the ESM build pulls in all read codecs if `read` is imported. > > Note: For writing, `writeFileXLSX` and `writeXLSX` is specific to the `XLSX` format, which helps avoid pulling in the other write codecs. > > . > > That said, we should update the docs for the other build systems. Are you using Webpack directly or through something like create-react-app? I've tried `import { read, utils, writeFileXLSX } from 'xlsx'` then `import { read, utils, writeFile } from 'xlsx'` However, the bundle size did not change (which should augment if tree shaking works). I'm using webpack5 through vue-cli5.

kingyue737 commented

2022-02-24 03:25:12 +00:00

(Migrated from github.com)

My bad, I've compared wrong report files. It does augment the parsed size by 50KB, which means tree shaking works. But still much larger than mini.min version. Hopes 'module not found' error of mini.min version can be fixed. Thanks for your reply.

SheetJSDev commented

2022-02-25 01:18:19 +00:00

(Migrated from github.com)

The mini build issue is the same as #2526

Sign in to join this conversation.