Webpack HookWebpackError: Missed semicolon when i build next js project

When i deploy my next js project then show the error. i could not find the error . Can anyone help me to find the error and how i resoved it.

8:34:41 PM: Failed to compile.
8:34:41 PM:
8:34:41 PM: HookWebpackError: /opt/build/repo/static/css/94c1be22d921d7dc.css:579:20: Missed semicolon
8:34:41 PM: at makeWebpackError (/opt/build/repo/node_modules/next/dist/compiled/webpack/bundle5.js:28:311209)
8:34:41 PM: at /opt/build/repo/node_modules/next/dist/compiled/webpack/bundle5.js:28:106058
8:34:41 PM: at eval (eval at create (/opt/build/repo/node_modules/next/dist/compiled/webpack/bundle5.js:13:28867), :44:1)
8:34:41 PM: – inner error –
8:34:41 PM: CssSyntaxError: /opt/build/repo/static/css/94c1be22d921d7dc.css:579:20: Missed semicolon
8:34:41 PM: at Input.error (/opt/build/repo/node_modules/next/node_modules/postcss/lib/input.js:106:16)
8:34:41 PM: at ScssParser.checkMissedSemicolon (/opt/build/repo/node_modules/next/node_modules/postcss/lib/parser.js:139:22)
8:34:41 PM: at ScssParser.decl (/opt/build/repo/node_modules/next/node_modules/postcss/lib/parser.js:297:12)
8:34:41 PM: at ScssParser.other (/opt/build/repo/node_modules/next/node_modules/postcss/lib/parser.js:400:18)
8:34:41 PM: at ScssParser.parse (/opt/build/repo/node_modules/next/node_modules/postcss/lib/parser.js:471:16)
8:34:41 PM: at scssParse (/opt/build/repo/node_modules/next/dist/compiled/postcss-scss/scss-syntax.js:1:322)
8:34:41 PM: at new LazyResult (/opt/build/repo/node_modules/next/node_modules/postcss/lib/lazy-result.js:133:16)
8:34:41 PM: at Processor.process (/opt/build/repo/node_modules/next/node_modules/postcss/lib/processor.js:53:14)
8:34:41 PM: at CssMinimizerPlugin.optimizeAsset (/opt/build/repo/node_modules/next/dist/build/webpack/plugins/css-minimizer-plugin.js:48:12)
8:34:41 PM: at /opt/build/repo/node_modules/next/dist/build/webpack/plugins/css-minimizer-plugin.js:79:55
8:34:41 PM: caused by plugins in Compilation.hooks.processAssets
8:34:41 PM: CssSyntaxError: /opt/build/repo/static/css/94c1be22d921d7dc.css:579:20: Missed semicolon
8:34:41 PM: at Input.error (/opt/build/repo/node_modules/next/node_modules/postcss/lib/input.js:106:16)
8:34:41 PM: at ScssParser.checkMissedSemicolon (/opt/build/repo/node_modules/next/node_modules/postcss/lib/parser.js:139:22)
8:34:41 PM: at ScssParser.decl (/opt/build/repo/node_modules/next/node_modules/postcss/lib/parser.js:297:12)
8:34:41 PM: at ScssParser.other (/opt/build/repo/node_modules/next/node_modules/postcss/lib/parser.js:400:18)
8:34:41 PM: at ScssParser.parse (/opt/build/repo/node_modules/next/node_modules/postcss/lib/parser.js:471:16)
8:34:41 PM: at scssParse (/opt/build/repo/node_modules/next/dist/compiled/postcss-scss/scss-syntax.js:1:322)
8:34:41 PM: at new LazyResult (/opt/build/repo/node_modules/next/node_modules/postcss/lib/lazy-result.js:133:16)
8:34:41 PM: at Processor.process (/opt/build/repo/node_modules/next/node_modules/postcss/lib/processor.js:53:14)
8:34:41 PM: at CssMinimizerPlugin.optimizeAsset (/opt/build/repo/node_modules/next/dist/build/webpack/plugins/css-minimizer-plugin.js:48:12)
8:34:41 PM: at /opt/build/repo/node_modules/next/dist/build/webpack/plugins/css-minimizer-plugin.js:79:55
8:34:41 PM: > Build failed because of webpack errors

@hasibimamhridoy You’ve already highlighted the error yourself in the thread title:

8:34:41 PM: HookWebpackError: /opt/build/repo/static/css/94c1be22d921d7dc.css:579:20: Missed semicolon

Check the /static/css/94c1be22d921d7dc.css file at line 579 for a missing semicolon.

1 Like