Using the example with ant design https://github.com/zeit/next.js/tree/master/examples/with-ant-design
npx create-next-app --example with-ant-design with-ant-design-appcd with-ant-design-appnpm run build && npx next exportoutput
> using build directory: /Users/vancelongwill/projects/with-ant-design-app/.next
copying "static build" directory
> No "exportPathMap" found in "next.config.js". Generating map from "./pages"
launching 3 threads with concurrency of 10 per thread
/Users/vancelongwill/projects/with-ant-design-app/node_modules/antd/lib/style/index.css:7
body {
^
SyntaxError: Unexpected token {
at createScript (vm.js:80:10)
at Object.runInThisContext (vm.js:139:10)
at Module._compile (module.js:616:28)
at Object.Module._extensions..js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
at Object.<anonymous> (/Users/vancelongwill/projects/with-ant-design-app/node_modules/antd/lib/button/style/css.js:3:1)
/Users/vancelongwill/projects/with-ant-design-app/node_modules/antd/lib/style/index.css:7
body {
^
SyntaxError: Unexpected token {
at createScript (vm.js:80:10)
at Object.runInThisContext (vm.js:139:10)
at Module._compile (module.js:616:28)
at Object.Module._extensions..js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
at Object.<anonymous> (/Users/vancelongwill/projects/with-ant-design-app/node_modules/antd/lib/button/style/css.js:3:1)
{}
Error [ERR_IPC_CHANNEL_CLOSED]: channel closed
at process.target.send (internal/child_process.js:588:16)
at work (/Users/vancelongwill/projects/with-ant-design-app/node_modules/next/dist/export/worker.js:94:21)
at <anonymous>
(node:31466) UnhandledPromiseRejectionWarning: Error [ERR_IPC_CHANNEL_CLOSED]: channel closed
at process.target.send (internal/child_process.js:588:16)
at process.on (/Users/vancelongwill/projects/with-ant-design-app/node_modules/next/dist/export/worker.js:102:17)
at <anonymous>
(node:31466) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:31466) [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.
--------------------------------
Same, it works fine with next dev but fails on next export
I had the same problem, to export I import the css file into _app.js with
import "antd/dist/antd.css"
my next.config.js has a less wrapper in the css one.
return withCSS(
withLess({
lessLoaderOptions: {
javascriptEnabled: true}}))
and the babelrc is this:
{
"presets": ["next/babel"],
"plugins": [
[
"import", {
"libraryName": "antd",
"style": false
},
],
["@babel/plugin-proposal-decorators", { "legacy": true }],
["@babel/plugin-proposal-class-properties", { "loose": true }]
]
}
but this solution loads the whole css file which is around 600kb, so this is not a practical workaround
same problem who can help me
@VanceLongwill are you resolve it? please tell me ths!
same issue, anyone found a solution yet @VanceLongwill
Most helpful comment
Same, it works fine with
next devbut fails onnext export