我想在我的新项目中使用StyleX,但我在尝试使用它时遇到了一些麻烦(与NextJS一起使用)。
我不明白如何配置“next.js.js”文件(创建“babel.js.js”文件会与“next.js.js”文件产生冲突)。
我被困在一个项目的开始,从StyleX文档中我看不到解决方案,也许我是瞎子或什么。
实际情况:
. babelrc.js文件:
module.exports = {
presets: ["next/babel"],
plugins: [
[
"@stylexjs/babel-plugin",
{
dev: process.env.NODE_ENV === "development",
runtimeInjection: false,
genConditionalClasses: true,
treeshakeCompensation: true,
unstable_moduleResolution: {
type: "commonJS",
rootDir: __dirname,
},
},
],
],
};
字符串
next.js.js文件:
/** @type {import('next').NextConfig} */
const stylexPlugin = require("@stylexjs/nextjs-plugin");
const nextConfig = {
reactStrictMode: true,
};
module.exports = stylexPlugin({
rootDir: __dirname,
})(nextConfig);
module.exports = nextConfig;
型
错误:
“next/font”需要SWC,尽管由于存在自定义babel配置而使用了Babel。
2条答案
按热度按时间ldxq2e6h1#
这是简单的设置。首先,安装这个插件,
字符串
如果根目录不存在
.babelrc.js
文件,则在根目录中创建该文件,并将以下代码添加到该文件中。型
使用以下命令调整
next.config.js
文件。型
现在,您已经准备好探索
stylex
。ckocjqey2#
使用Babel的项目不支持next/font。请删除next/font的用法。