Comments (3)
The solution is to downgrade imagemin-svgo
to version 9.0.0
. The latest version (10.0.0
) has ES module support only, therefore is not compatible with next-optimized-images
package (this package still uses require
imports, not ES module import
syntax)
from next-optimized-images.
I also had to downgrade "imagemin-mozjpeg": "9.0.0",
from version 10.0.0
to get this to work
from next-optimized-images.
Same here. Here is the full output:
> Build error occurred
Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/imagemin-svgo/index.js from /Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next-optimized-images/lib/loaders/img-loader.js not supported.
Instead change the require of index.js in /Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next-optimized-images/lib/loaders/img-loader.js to a dynamic import() which is available in all CommonJS modules.
at requireImageminPlugin (/Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next-optimized-images/lib/loaders/img-loader.js:21:10)
at getImgLoaderOptions (/Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next-optimized-images/lib/loaders/img-loader.js:50:11)
at applyImgLoader (/Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next-optimized-images/lib/loaders/img-loader.js:96:28)
at appendLoaders (/Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next-optimized-images/lib/loaders/index.js:137:14)
at Object.webpack (/Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next-optimized-images/lib/index.js:62:24)
at Object.getBaseWebpackConfig [as default] (/Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next/dist/build/webpack-config.js:1327:32)
at async Promise.all (index 0)
at async Span.traceAsyncFn (/Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next/dist/trace/trace.js:74:20)
at async /Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next/dist/build/index.js:315:25
at async Span.traceAsyncFn (/Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next/dist/trace/trace.js:74:20)
at async Object.build [as default] (/Users/jbaczuk/Development/Personal/jordan-baczuk/node_modules/next/dist/build/index.js:80:25) {
code: 'ERR_REQUIRE_ESM'
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
from next-optimized-images.
Related Issues (20)
- Create an example in Next.js /examples folder
- Image is not getting compressed in my NEXT app HOT 2
- imagemin-svgo version 10.0.0 compatibility
- Bump sharp to v0.29.0 HOT 2
- Error: Input buffer contains unsupported image format HOT 1
- Error: Objects are not valid as a React child HOT 1
- Next 12 - got next dev, next build and next export to work - update documentation HOT 1
- images that copied into the static folder(/_next/static/media/*) are damaged HOT 9
- Problem when using next.js github pages template + next-optimized-images
- Dynamic urls not supported
- Support for imagemin-mozjpeg v10 HOT 2
- .svg?sprite are included in client side bundle
- Images within client-side-only loaded components arenβt optimized HOT 1
- TypeError: unsupported file type: undefined (file: undefined) HOT 5
- Warning from nextjs when optimizeImages and inlineImageLimit are used HOT 2
- Compatible with Next 13? HOT 2
- kgroundimage using in reactjs
- image optimization issue
- add support for svg components
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from next-optimized-images.