feat(rspack): non-inferred targets should work OOTB (#29733)
This commit is contained in:
parent
d6015613f5
commit
21a1f4e385
60
e2e/react/src/react-rspack.test.ts
Normal file
60
e2e/react/src/react-rspack.test.ts
Normal file
@ -0,0 +1,60 @@
|
||||
import {
|
||||
checkFilesExist,
|
||||
cleanupProject,
|
||||
killPorts,
|
||||
newProject,
|
||||
readFile,
|
||||
runCLI,
|
||||
runE2ETests,
|
||||
uniq,
|
||||
updateFile,
|
||||
} from '@nx/e2e/utils';
|
||||
|
||||
describe('Build React applications and libraries with Rspack', () => {
|
||||
let proj: string;
|
||||
beforeAll(() => {
|
||||
proj = newProject({
|
||||
packages: ['@nx/react'],
|
||||
});
|
||||
});
|
||||
|
||||
afterAll(() => {
|
||||
cleanupProject();
|
||||
});
|
||||
|
||||
it('should be able to use Rspack to build and test apps', async () => {
|
||||
const appName = uniq('app');
|
||||
const libName = uniq('lib');
|
||||
|
||||
runCLI(
|
||||
`generate @nx/react:app ${appName} --bundler=rspack --unit-test-runner=vitest --no-interactive --skipFormat --linter=eslint`
|
||||
);
|
||||
runCLI(
|
||||
`generate @nx/react:lib ${libName} --bundler=none --no-interactive --unit-test-runner=vitest --skipFormat --linter=eslint`
|
||||
);
|
||||
|
||||
// Library generated with Vite
|
||||
checkFilesExist(`${libName}/vite.config.ts`);
|
||||
|
||||
const mainPath = `${appName}/src/main.tsx`;
|
||||
updateFile(
|
||||
mainPath,
|
||||
`
|
||||
import '@${proj}/${libName}';
|
||||
${readFile(mainPath)}
|
||||
`
|
||||
);
|
||||
|
||||
runCLI(`build ${appName}`, { verbose: true });
|
||||
|
||||
checkFilesExist(`dist/${appName}/index.html`);
|
||||
|
||||
if (runE2ETests()) {
|
||||
const e2eResults = runCLI(`e2e ${appName}-e2e`, {
|
||||
verbose: true,
|
||||
});
|
||||
expect(e2eResults).toContain('Successfully ran target e2e for project');
|
||||
expect(await killPorts()).toBeTruthy();
|
||||
}
|
||||
}, 250_000);
|
||||
});
|
||||
@ -62,43 +62,6 @@ describe('React Applications', () => {
|
||||
}
|
||||
}, 250_000);
|
||||
|
||||
it('should be able to use Rspack to build and test apps', async () => {
|
||||
const appName = uniq('app');
|
||||
const libName = uniq('lib');
|
||||
|
||||
runCLI(
|
||||
`generate @nx/react:app ${appName} --bundler=rspack --unit-test-runner=vitest --no-interactive --skipFormat --linter=eslint`
|
||||
);
|
||||
runCLI(
|
||||
`generate @nx/react:lib ${libName} --bundler=none --no-interactive --unit-test-runner=vitest --skipFormat --linter=eslint`
|
||||
);
|
||||
|
||||
// Library generated with Vite
|
||||
checkFilesExist(`${libName}/vite.config.ts`);
|
||||
|
||||
const mainPath = `${appName}/src/main.tsx`;
|
||||
updateFile(
|
||||
mainPath,
|
||||
`
|
||||
import '@${proj}/${libName}';
|
||||
${readFile(mainPath)}
|
||||
`
|
||||
);
|
||||
|
||||
runCLI(`build ${appName}`, { verbose: true });
|
||||
|
||||
checkFilesExist(`dist/${appName}/index.html`);
|
||||
|
||||
if (runE2ETests()) {
|
||||
// TODO(Colum): investigate why webkit is failing
|
||||
const e2eResults = runCLI(`e2e ${appName}-e2e -- --project=chromium`, {
|
||||
verbose: true,
|
||||
});
|
||||
expect(e2eResults).toContain('Successfully ran target e2e for project');
|
||||
expect(await killPorts()).toBeTruthy();
|
||||
}
|
||||
}, 250_000);
|
||||
|
||||
it('should be able to generate a react app + lib (with CSR and SSR)', async () => {
|
||||
const appName = uniq('app');
|
||||
const libName = uniq('lib');
|
||||
|
||||
@ -254,7 +254,9 @@ function createConfig(
|
||||
|
||||
const defaultConfig = generateDefaultConfig(project, buildOptions);
|
||||
|
||||
if (isWebFramework(options)) {
|
||||
if (options.framework === 'react') {
|
||||
return generateReactConfig(options);
|
||||
} else if (isWebFramework(options)) {
|
||||
return generateWebConfig(tree, options, defaultConfig);
|
||||
} else if (options.framework === 'nest') {
|
||||
return generateNestConfig(tree, options, project, buildOptions);
|
||||
@ -338,6 +340,26 @@ module.exports = composePlugins(withNx(), withWeb(${
|
||||
`;
|
||||
}
|
||||
|
||||
function generateReactConfig({
|
||||
stylePreprocessorOptions,
|
||||
}: ConfigurationWithStylePreprocessorOptions) {
|
||||
return `
|
||||
const { composePlugins, withNx, withReact } = require('@nx/rspack');
|
||||
|
||||
module.exports = composePlugins(withNx(), withReact(${
|
||||
stylePreprocessorOptions
|
||||
? `
|
||||
{
|
||||
stylePreprocessorOptions: ${JSON.stringify(stylePreprocessorOptions)},
|
||||
}
|
||||
`
|
||||
: ''
|
||||
}), (config) => {
|
||||
return config;
|
||||
});
|
||||
`;
|
||||
}
|
||||
|
||||
function generateNestConfig(
|
||||
tree: Tree,
|
||||
options: ConfigurationSchema,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user