fix(next-plugin): url statements in vanilla css would not respect next's setup for resolving assets (#1155)

Author: GeeWizWow

.changeset/calm-starfishes-smell.md

@@ -0,0 +1,5 @@
+---
+'@vanilla-extract/next-plugin': patch
+---
+
+Fix URL statements not not respecting Next's setup for resolving assets

packages/next-plugin/src/index.ts

@@ -2,6 +2,7 @@ import { VanillaExtractPlugin } from '@vanilla-extract/webpack-plugin';
 import browserslist from 'browserslist';
 import { lazyPostCSS } from 'next/dist/build/webpack/config/blocks/css';
 import { findPagesDir } from 'next/dist/lib/find-pages-dir';
+import { cssFileResolve } from 'next/dist/build/webpack/config/blocks/css/loaders/file-resolve';
 import NextMiniCssExtractPluginDefault from 'next/dist/build/webpack/plugins/mini-css-extract-plugin';
 
 import type webpack from 'webpack';
@@ -60,6 +61,18 @@ const getVanillaExtractCssLoaders = (
       postcss,
       importLoaders: 1,
       modules: false,
+      url: (url: string, resourcePath: string) =>
+        cssFileResolve(
+          url,
+          resourcePath,
+          options.config.experimental?.urlImports,
+        ),
+      import: (url: string, _: any, resourcePath: string) =>
+        cssFileResolve(
+          url,
+          resourcePath,
+          options.config.experimental?.urlImports,
+        ),
     },
   });