Next-plugins: SyntaxError when running next export on with-ant-design example

Created on 28 Apr 2019  路  5Comments  路  Source: vercel/next-plugins

Using the example with ant design https://github.com/zeit/next.js/tree/master/examples/with-ant-design

Steps to reproduce

  1. npx create-next-app --example with-ant-design with-ant-design-app
  2. cd with-ant-design-app
  3. run npm run build && npx next export

output

> 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.
--------------------------------

Most helpful comment

Same, it works fine with next dev but fails on next export

All 5 comments

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

Was this page helpful?
0 / 5 - 0 ratings