Import Issues in Next.js 14 with Server Actions #16
Comments
|
Hey. Thanks for the feedback So, this is a problem with Next and more specifically Webpack. Here https://github.com/poppinss/utils/blob/develop/src/fs_import_all.ts#L47 we're using a dynamic So I would recommend two solutions:
There's the Let me know if it sounds good to you! |
|
Hello. I was using Bentocache to cache (in-memory) avatars URLs. I'm now upgrading to Next Auth v5, and everything broke. Got this error:
Tried to patch it like this: // next.config.js
/* v8 ignore start */
// Stryker disable all
// @ts-check
const { webpack } = require('next/dist/compiled/webpack/webpack');
const { withContentlayer } = require('next-contentlayer');
const withBundleAnalyzer = require('@next/bundle-analyzer')({
enabled: process.env.ANALYZE === 'true'
});
const ignoreBuildErrors = process.env.IGNORE_BUILD_ERRORS === 'true';
const ignoreEslintDuringBuilds = process.env.IGNORE_ESLINT_DURING_BUILDS === 'true';
/** @type {import('next').NextConfig} */
const nextConfig = {
// eslint-disable-next-line require-await
async redirects() {
return [
/* eslint-disable perfectionist/sort-objects */
{
source: '/:lng/lp',
destination: '/:lng/lp/sign-up',
permanent: true
},
{
source: '/lp',
destination: '/lp/sign-up',
permanent: true
}
/* eslint-enable perfectionist/sort-objects */
];
},
// * ... here!
webpack: (config) => {
config.plugins.push(
new webpack.NormalModuleReplacementPlugin(/node:/, (resource) => {
resource.request = resource.request.replace(/^node:/, '');
})
);
return config;
},
eslint: {
ignoreDuringBuilds: ignoreEslintDuringBuilds
},
images: {
domains: ['cdn.discordapp.com']
},
typescript: {
ignoreBuildErrors
},
reactStrictMode: true,
swcMinify: true
};
module.exports = withBundleAnalyzer(withContentlayer(nextConfig));
// Stryker restore all
/* v8 ignore stop */Results in:
EDIT: Reproducible from here Does it bring up more meaningful hints? EDIT 2: |
|
Built again from scratch a project with Next Auth v5.
Interesting... |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Problem Description
An import issue has been identified in Next.js 14 when using Server Actions. Although the project functions using memoryDriver, import errors are observed in the console when running the project. Even when recreating the issue in a new empty Next.js 14 template with App Router, import issues persist in the console, although it works at least using memoryDriver.
A minimal reproducible example has been provided in StackBlitz.
Steps to Reproduce the Problem
npm installto install the dependencies.npm run devto start the development server.Console Output
Project Dependencies
{ "name": "bento-nextjs", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "bentocache": "^1.0.0-beta.8", "next": "14.2.0", "react": "^18", "react-dom": "^18" }, "devDependencies": { "@types/node": "^20", "@types/react": "^18", "@types/react-dom": "^18", "eslint": "^8", "eslint-config-next": "14.2.0", "postcss": "^8", "tailwindcss": "^3.4.1", "typescript": "^5" } }Minimal Reproducible Example
The minimal reproducible example can be found in the provided StackBlitz.
Additional Information
Apparently, the import issue might be related to the usage of
@poppinss/utils.Any guidance or solution to address these import issues in Next.js 14 would be appreciated.
Thank you for your attention to this matter!
Sincerely,
Valentin
The text was updated successfully, but these errors were encountered: