Webpack build error on Next.js 13.2 #1013

re-taro · 2023-02-24T06:50:04Z

Describe the bug

Error with internal webpack configuration at build time when using @vanilla-extract/next-plugin in Next.js v13.2 delivered yesterday.

Reproduction

https://github.com/re-taro-dev/card.re-taro.dev

System Info

System:
    OS: Windows 10 10.0.22621
    CPU: (12) x64 Intel(R) Core(TM) i7-10750H CPU @ 2.60GHz
    Memory: 3.98 GB / 15.79 GB
  Binaries:
    Node: 18.14.2 - ~\scoop\apps\nodejs-lts\current\node.EXE
    Yarn: 1.22.19 - ~\scoop\apps\yarn\current\bin\yarn.CMD
    npm: 9.5.0 - ~\scoop\apps\nodejs-lts\current\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.1265.0), Chromium (110.0.1587.46)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    @vanilla-extract/css: 1.9.5 => 1.9.5
    @vanilla-extract/next-plugin: 2.1.1 => 2.1.1
    webpack: 5.75.0 => 5.75.0

Used Package Manager

pnpm

Logs

Failed to compile.

./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/extracted.js.webpack[javascript/auto]!=!./node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[4].oneOf[0].use[1]!./node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[4].oneOf[0].use[2]!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{"fileName":"src/styles/home.css.ts.vanilla.css","source":"QGtleWZyYW1lcyBfMW84d2RzdzIgewogIGZyb20gewogICAgb3BhY2l0eTogMDsKICB9CiAgdG8gewogICAgb3BhY2l0eTogMTsKICB9Cn0KLl8xbzh3ZHN3MCB7CiAgd2lkdGg6IDEwMHZ3OwogIGhlaWdodDogMTAwdmg7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMDsKICBsZWZ0OiAwOwogIHotaW5kZXg6IDA7Cn0KLl8xbzh3ZHN3MSB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMC40cmVtOwogIHJpZ2h0OiAwLjVyZW07CiAgZm9udC1zaXplOiAxcmVtOwogIG9wYWNpdHk6IDAuNDsKfQouXzFvOHdkc3czIHsKICBkaXNwbGF5OiBpbmxpbmUtZmxleDsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGNvbG9yOiAjNGM1NjZhOwogIG1hcmdpbjogMC4ycmVtIDAuMnJlbSAwIDAuNXJlbTsKICBnYXA6IDAuNXJlbTsKICBhbmltYXRpb246IF8xbzh3ZHN3MiAycyBlYXNlLW91dCAxcyBib3RoOwogIHotaW5kZXg6IDEwMDsKfQouXzFvOHdkc3c0IHsKICBmb250LXNpemU6IDEuMnJlbTsKICBmb250LXdlaWdodDogMzAwOwogIHotaW5kZXg6IDA7Cn0="}!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/extracted.js
TypeError: options.postcss is not a function
    at /home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js:37:55
    at Span.traceAsyncFn (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/trace/trace.js:79:26)
    at Object.loader (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js:12:16)

Import trace for requested module:
./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/extracted.js.webpack[javascript/auto]!=!./node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[4].oneOf[0].use[1]!./node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[4].oneOf[0].use[2]!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{"fileName":"src/styles/home.css.ts.vanilla.css","source":"QGtleWZyYW1lcyBfMW84d2RzdzIgewogIGZyb20gewogICAgb3BhY2l0eTogMDsKICB9CiAgdG8gewogICAgb3BhY2l0eTogMTsKICB9Cn0KLl8xbzh3ZHN3MCB7CiAgd2lkdGg6IDEwMHZ3OwogIGhlaWdodDogMTAwdmg7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMDsKICBsZWZ0OiAwOwogIHotaW5kZXg6IDA7Cn0KLl8xbzh3ZHN3MSB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMC40cmVtOwogIHJpZ2h0OiAwLjVyZW07CiAgZm9udC1zaXplOiAxcmVtOwogIG9wYWNpdHk6IDAuNDsKfQouXzFvOHdkc3czIHsKICBkaXNwbGF5OiBpbmxpbmUtZmxleDsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGNvbG9yOiAjNGM1NjZhOwogIG1hcmdpbjogMC4ycmVtIDAuMnJlbSAwIDAuNXJlbTsKICBnYXA6IDAuNXJlbTsKICBhbmltYXRpb246IF8xbzh3ZHN3MiAycyBlYXNlLW91dCAxcyBib3RoOwogIHotaW5kZXg6IDEwMDsKfQouXzFvOHdkc3c0IHsKICBmb250LXNpemU6IDEuMnJlbTsKICBmb250LXdlaWdodDogMzAwOwogIHotaW5kZXg6IDA7Cn0="}!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/extracted.js
src/styles/home.css.ts.vanilla.css!=!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{"fileName":"src/styles/home.css.ts.vanilla.css","source":"QGtleWZyYW1lcyBfMW84d2RzdzIgewogIGZyb20gewogICAgb3BhY2l0eTogMDsKICB9CiAgdG8gewogICAgb3BhY2l0eTogMTsKICB9Cn0KLl8xbzh3ZHN3MCB7CiAgd2lkdGg6IDEwMHZ3OwogIGhlaWdodDogMTAwdmg7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMDsKICBsZWZ0OiAwOwogIHotaW5kZXg6IDA7Cn0KLl8xbzh3ZHN3MSB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMC40cmVtOwogIHJpZ2h0OiAwLjVyZW07CiAgZm9udC1zaXplOiAxcmVtOwogIG9wYWNpdHk6IDAuNDsKfQouXzFvOHdkc3czIHsKICBkaXNwbGF5OiBpbmxpbmUtZmxleDsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGNvbG9yOiAjNGM1NjZhOwogIG1hcmdpbjogMC4ycmVtIDAuMnJlbSAwIDAuNXJlbTsKICBnYXA6IDAuNXJlbTsKICBhbmltYXRpb246IF8xbzh3ZHN3MiAycyBlYXNlLW91dCAxcyBib3RoOwogIHotaW5kZXg6IDEwMDsKfQouXzFvOHdkc3c0IHsKICBmb250LXNpemU6IDEuMnJlbTsKICBmb250LXdlaWdodDogMzAwOwogIHotaW5kZXg6IDA7Cn0="}!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/extracted.js
./src/styles/home.css.ts

src/styles/home.css.ts.vanilla.css!=!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{"fileName":"src/styles/home.css.ts.vanilla.css","source":"QGtleWZyYW1lcyBfMW84d2RzdzIgewogIGZyb20gewogICAgb3BhY2l0eTogMDsKICB9CiAgdG8gewogICAgb3BhY2l0eTogMTsKICB9Cn0KLl8xbzh3ZHN3MCB7CiAgd2lkdGg6IDEwMHZ3OwogIGhlaWdodDogMTAwdmg7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMDsKICBsZWZ0OiAwOwogIHotaW5kZXg6IDA7Cn0KLl8xbzh3ZHN3MSB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMC40cmVtOwogIHJpZ2h0OiAwLjVyZW07CiAgZm9udC1zaXplOiAxcmVtOwogIG9wYWNpdHk6IDAuNDsKfQouXzFvOHdkc3czIHsKICBkaXNwbGF5OiBpbmxpbmUtZmxleDsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGNvbG9yOiAjNGM1NjZhOwogIG1hcmdpbjogMC4ycmVtIDAuMnJlbSAwIDAuNXJlbTsKICBnYXA6IDAuNXJlbTsKICBhbmltYXRpb246IF8xbzh3ZHN3MiAycyBlYXNlLW91dCAxcyBib3RoOwogIHotaW5kZXg6IDEwMDsKfQouXzFvOHdkc3c0IHsKICBmb250LXNpemU6IDEuMnJlbTsKICBmb250LXdlaWdodDogMzAwOwogIHotaW5kZXg6IDA7Cn0="}!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/extracted.js
TypeError: options.postcss is not a function
    at /home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js:37:55
    at Span.traceAsyncFn (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/trace/trace.js:79:26)
    at Object.loader (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js:12:16)
    at tryRunOrWebpackError (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:308539)
    at __webpack_require_module__ (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:130357)
    at __nested_webpack_require_153265__ (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:129784)
    at /home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:130649
    at symbolIterator (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/neo-async/async.js:1:14444)
    at done (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/neo-async/async.js:1:14824)
    at Hook.eval [as callAsync] (eval at create (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:13:28771), <anonymous>:15:1)
    at /home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:129504
    at symbolIterator (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/neo-async/async.js:1:14402)
    at timesSync (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/neo-async/async.js:1:5027)
-- inner error --
TypeError: options.postcss is not a function
    at /home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js:37:55
    at Span.traceAsyncFn (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/trace/trace.js:79:26)
    at Object.loader (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js:12:16)
    at Object.<anonymous> (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[4].oneOf[0].use[1]!/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[4].oneOf[0].use[2]!/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{"fileName":"src/styles/home.css.ts.vanilla.css","source":"QGtleWZyYW1lcyBfMW84d2RzdzIgewogIGZyb20gewogICAgb3BhY2l0eTogMDsKICB9CiAgdG8gewogICAgb3BhY2l0eTogMTsKICB9Cn0KLl8xbzh3ZHN3MCB7CiAgd2lkdGg6IDEwMHZ3OwogIGhlaWdodDogMTAwdmg7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMDsKICBsZWZ0OiAwOwogIHotaW5kZXg6IDA7Cn0KLl8xbzh3ZHN3MSB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMC40cmVtOwogIHJpZ2h0OiAwLjVyZW07CiAgZm9udC1zaXplOiAxcmVtOwogIG9wYWNpdHk6IDAuNDsKfQouXzFvOHdkc3czIHsKICBkaXNwbGF5OiBpbmxpbmUtZmxleDsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGNvbG9yOiAjNGM1NjZhOwogIG1hcmdpbjogMC4ycmVtIDAuMnJlbSAwIDAuNXJlbTsKICBnYXA6IDAuNXJlbTsKICBhbmltYXRpb246IF8xbzh3ZHN3MiAycyBlYXNlLW91dCAxcyBib3RoOwogIHotaW5kZXg6IDEwMDsKfQouXzFvOHdkc3c0IHsKICBmb250LXNpemU6IDEuMnJlbTsKICBmb250LXdlaWdodDogMzAwOwogIHotaW5kZXg6IDA7Cn0="}!/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/extracted.js:1:7)
    at /home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:901184
    at Hook.eval [as call] (eval at create (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:13:28549), <anonymous>:7:1)
    at /home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:130390
    at tryRunOrWebpackError (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:308493)
    at __webpack_require_module__ (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:130357)
    at __nested_webpack_require_153265__ (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:129784)
    at /home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/webpack/bundle5.js:28:130649
    at symbolIterator (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/neo-async/async.js:1:14444)
    at done (/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/compiled/neo-async/async.js:1:14824)

Generated code for /home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[4].oneOf[0].use[1]!/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/[email protected]_biqbaboplfbrettd7655fr4n2y/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[4].oneOf[0].use[2]!/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{"fileName":"src/styles/home.css.ts.vanilla.css","source":"QGtleWZyYW1lcyBfMW84d2RzdzIgewogIGZyb20gewogICAgb3BhY2l0eTogMDsKICB9CiAgdG8gewogICAgb3BhY2l0eTogMTsKICB9Cn0KLl8xbzh3ZHN3MCB7CiAgd2lkdGg6IDEwMHZ3OwogIGhlaWdodDogMTAwdmg7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMDsKICBsZWZ0OiAwOwogIHotaW5kZXg6IDA7Cn0KLl8xbzh3ZHN3MSB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMC40cmVtOwogIHJpZ2h0OiAwLjVyZW07CiAgZm9udC1zaXplOiAxcmVtOwogIG9wYWNpdHk6IDAuNDsKfQouXzFvOHdkc3czIHsKICBkaXNwbGF5OiBpbmxpbmUtZmxleDsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGNvbG9yOiAjNGM1NjZhOwogIG1hcmdpbjogMC4ycmVtIDAuMnJlbSAwIDAuNXJlbTsKICBnYXA6IDAuNXJlbTsKICBhbmltYXRpb246IF8xbzh3ZHN3MiAycyBlYXNlLW91dCAxcyBib3RoOwogIHotaW5kZXg6IDEwMDsKfQouXzFvOHdkc3c0IHsKICBmb250LXNpemU6IDEuMnJlbTsKICBmb250LXdlaWdodDogMzAwOwogIHotaW5kZXg6IDA7Cn0="}!/home/runner/work/card.re-taro.dev/card.re-taro.dev/node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/extracted.js

Import trace for requested module:
src/styles/home.css.ts.vanilla.css!=!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/virtualFileLoader/dist/vanilla-extract-webpack-plugin-virtualFileLoader.cjs.js?{"fileName":"src/styles/home.css.ts.vanilla.css","source":"QGtleWZyYW1lcyBfMW84d2RzdzIgewogIGZyb20gewogICAgb3BhY2l0eTogMDsKICB9CiAgdG8gewogICAgb3BhY2l0eTogMTsKICB9Cn0KLl8xbzh3ZHN3MCB7CiAgd2lkdGg6IDEwMHZ3OwogIGhlaWdodDogMTAwdmg7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMDsKICBsZWZ0OiAwOwogIHotaW5kZXg6IDA7Cn0KLl8xbzh3ZHN3MSB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogMC40cmVtOwogIHJpZ2h0OiAwLjVyZW07CiAgZm9udC1zaXplOiAxcmVtOwogIG9wYWNpdHk6IDAuNDsKfQouXzFvOHdkc3czIHsKICBkaXNwbGF5OiBpbmxpbmUtZmxleDsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGNvbG9yOiAjNGM1NjZhOwogIG1hcmdpbjogMC4ycmVtIDAuMnJlbSAwIDAuNXJlbTsKICBnYXA6IDAuNXJlbTsKICBhbmltYXRpb246IF8xbzh3ZHN3MiAycyBlYXNlLW91dCAxcyBib3RoOwogIHotaW5kZXg6IDEwMDsKfQouXzFvOHdkc3c0IHsKICBmb250LXNpemU6IDEuMnJlbTsKICBmb250LXdlaWdodDogMzAwOwogIHotaW5kZXg6IDA7Cn0="}!./node_modules/.pnpm/@[email protected][email protected]/node_modules/@vanilla-extract/webpack-plugin/extracted.js
./src/styles/home.css.ts


> Build failed because of webpack errors
 ELIFECYCLE  Command failed with exit code 1.

Validations

Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
The provided reproduction is a minimal reproducible example of the bug.

The text was updated successfully, but these errors were encountered:

thevisioner · 2023-02-24T15:22:56Z

I can also confirm that there is a problem with the latest versions of Next.js. I also tested canary releases after v13.1.6 and the problem occurs with v13.1.7-canary.8 and up.. v13.1.7-canary.7 still works fine.

Error message in my case: "Error: You forgot to add 'mini-css-extract-plugin' plugin (i.e. { plugins: [new MiniCssExtractPlugin()] })"

rickdunkin · 2023-02-24T20:16:58Z

Seems likely to be related to this: vercel/next.js#46374

i-bsd · 2023-02-25T22:21:04Z

Same issue here. Is there a fix?

re-taro · 2023-02-25T23:09:21Z

It looks the issue is related to here

vercel/next.js#45455

luke-h1 · 2023-02-27T11:08:16Z

Looking into this further it seems that this problem is due to the next-plugin package which uses next internals that are prone to breakages since they're not public APIs (according to vercel/next.js#46374 (comment)).

import { lazyPostCSS } from 'next/dist/build/webpack/config/blocks/css';
import { getGlobalCssLoader } from 'next/dist/build/webpack/config/blocks/css/loaders';

shuding · 2023-02-27T13:11:41Z

Since vanilla-extract-css uses Next.js internal APIs and we recently upgraded it, it's no longer working. I opened a PR in Next.js to refactor that API to be non-breaking but in the meantime you'll have to pass: hasAppDir: nextConfig.experimental?.appDir here:

vanilla-extract/packages/next-plugin/src/index.js

Lines 40 to 47 in c59aee2

    
           { 
        
             assetPrefix: config.assetPrefix, 
        
             isClient: !isServer, 
        
             isServer, 
        
             isDevelopment: dev, 
        
             future: nextConfig.future || {}, 
        
             experimental: nextConfig.experimental || {}, 
        
           },

graup · 2023-02-27T13:58:44Z

Hi @shuding, thanks for helping us out! We discovered the hasAppDir fix also in #929, but it seems that additional changes (inside Next?) may be required. Could you have a look at that issue?

I applied your suggestion in a local patch and am still getting the same error options.postcss is not a function.

shuding · 2023-02-28T07:43:46Z

I'll take a look at #929! This issue requires a change on the Next.js side too, which was just released as canary so you might want to try next@canary with that change.

AndriRafnR · 2023-03-03T09:35:18Z

This appears to be resolved with nextjs version 13.2.3

graup · 2023-03-03T10:57:03Z

I have verified that this particular issue is resolved in next 13.2.3. 👍

I have also verified that the patches in #929 are still required to make VE work. Let's continue the conversation there.

re-taro added the pending triage label Feb 24, 2023

graup added nextjs Issue related to NextJS and removed pending triage labels Feb 27, 2023

thevisioner mentioned this issue Feb 27, 2023

Webpack loaders not found when building with [email protected] vercel/next.js#46374

Closed

1 task

graup closed this as completed Mar 3, 2023

graup mentioned this issue Mar 3, 2023

next-plugin: prepare for app dir support #1022

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Webpack build error on Next.js 13.2 #1013

Webpack build error on Next.js 13.2 #1013

re-taro commented Feb 24, 2023

thevisioner commented Feb 24, 2023 •

edited

Loading

rickdunkin commented Feb 24, 2023

i-bsd commented Feb 25, 2023

re-taro commented Feb 25, 2023

luke-h1 commented Feb 27, 2023

shuding commented Feb 27, 2023

graup commented Feb 27, 2023

shuding commented Feb 28, 2023

AndriRafnR commented Mar 3, 2023

graup commented Mar 3, 2023 •

edited

Loading

Webpack build error on Next.js 13.2 #1013

Webpack build error on Next.js 13.2 #1013

Comments

re-taro commented Feb 24, 2023

Describe the bug

Reproduction

System Info

Used Package Manager

Logs

Validations

thevisioner commented Feb 24, 2023 • edited Loading

rickdunkin commented Feb 24, 2023

i-bsd commented Feb 25, 2023

re-taro commented Feb 25, 2023

luke-h1 commented Feb 27, 2023

shuding commented Feb 27, 2023

graup commented Feb 27, 2023

shuding commented Feb 28, 2023

AndriRafnR commented Mar 3, 2023

graup commented Mar 3, 2023 • edited Loading

thevisioner commented Feb 24, 2023 •

edited

Loading

graup commented Mar 3, 2023 •

edited

Loading