Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(nextjs): with stylus and less support #16764

Merged
merged 1 commit into from
May 4, 2023
Merged

fix(nextjs): with stylus and less support #16764

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions e2e/next/src/next-styles.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,7 @@ describe('Next.js apps', () => {
process.env.NODE_ENV = originalEnv;
});

// TODO (meeroslav): enable when this flaky test is fixed
xit('should support different --style options', async () => {
it('should support different --style options', async () => {
const lessApp = uniq('app');

runCLI(`generate @nx/next:app ${lessApp} --no-interactive --style=less`);
Expand Down
9 changes: 7 additions & 2 deletions packages/next/plugins/with-less.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
// Adapted from https://raw.githubusercontent.com/elado/next-with-less/main/src/index.js
import { merge } from 'webpack-merge';
import { NextConfigFn } from '../src/utils/config';
import { WithNxOptions } from './with-nx';

const addLessToRegExp = (rx) =>
new RegExp(rx.source.replace('|sass', '|sass|less'), rx.flags);
Expand All @@ -13,9 +14,13 @@ function patchNextCSSWithLess(

patchNextCSSWithLess();

export function withLess(configFn: NextConfigFn): NextConfigFn {
export function withLess(
configOrFn: NextConfigFn | WithNxOptions
): NextConfigFn {
return async (phase: string) => {
const { lessLoaderOptions = {}, ...nextConfig } = await configFn(phase);
const baseConfig =
typeof configOrFn === 'function' ? await configOrFn(phase) : configOrFn;
const { lessLoaderOptions = {}, ...nextConfig } = baseConfig;

return Object.assign({}, nextConfig, {
webpack(config, opts) {
Expand Down
9 changes: 7 additions & 2 deletions packages/next/plugins/with-stylus.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
// Adapted from https://raw.githubusercontent.com/elado/next-with-less/main/src/index.js
import { merge } from 'webpack-merge';
import { NextConfigFn } from '../src/utils/config';
import { WithNxOptions } from './with-nx';

const addStylusToRegExp = (rx) =>
new RegExp(rx.source.replace('|sass', '|sass|styl'), rx.flags);
Expand All @@ -13,9 +14,13 @@ function patchNextCSSWithStylus(

patchNextCSSWithStylus();

export function withStylus(configFn: NextConfigFn): NextConfigFn {
export function withStylus(
configOrFn: WithNxOptions | NextConfigFn
): NextConfigFn {
return async (phase: string) => {
const { stylusLoaderOptions = {}, ...nextConfig } = await configFn(phase);
const baseConfig =
typeof configOrFn === 'function' ? await configOrFn(phase) : configOrFn;
const { stylusLoaderOptions = {}, ...nextConfig } = baseConfig;

return Object.assign({}, nextConfig, {
webpack(config, opts) {
Expand Down