diff --git a/e2e/webpack/src/webpack.test.ts b/e2e/webpack/src/webpack.test.ts index b57164a5321d3b..0bb2a15becd738 100644 --- a/e2e/webpack/src/webpack.test.ts +++ b/e2e/webpack/src/webpack.test.ts @@ -1,6 +1,7 @@ import { checkFilesExist, cleanupProject, + createFile, fileExists, listFiles, newProject, @@ -406,6 +407,202 @@ describe('Webpack Plugin', () => { `Successfully ran target build for project ${appName}` ); }); + + describe('config types', () => { + it('should support a standard config object', () => { + const appName = uniq('app'); + + runCLI( + `generate @nx/react:application --directory=apps/${appName} --bundler=webpack --e2eTestRunner=none` + ); + + updateFile( + `apps/${appName}/webpack.config.js`, + ` + const path = require('path'); + const { NxAppWebpackPlugin } = require('@nx/webpack/app-plugin'); + + module.exports = { + target: 'node', + output: { + path: path.join(__dirname, '../../dist/${appName}') + }, + plugins: [ + new NxAppWebpackPlugin({ + compiler: 'babel', + main: './src/main.tsx', + tsConfig: './tsconfig.app.json', + outputHashing: 'none', + optimization: false, + }) + ] + };` + ); + + const result = runCLI(`build ${appName}`); + + expect(result).toContain( + `Successfully ran target build for project ${appName}` + ); + }); + + it('should support a standard function that returns a config object', () => { + const appName = uniq('app'); + + runCLI( + `generate @nx/react:application --directory=apps/${appName} --bundler=webpack --e2eTestRunner=none` + ); + + updateFile( + `apps/${appName}/webpack.config.js`, + ` + const path = require('path'); + const { NxAppWebpackPlugin } = require('@nx/webpack/app-plugin'); + + module.exports = () => { + return { + target: 'node', + output: { + path: path.join(__dirname, '../../dist/${appName}') + }, + plugins: [ + new NxAppWebpackPlugin({ + compiler: 'tsc', + main: './src/main.tsx', + tsConfig: './tsconfig.app.json', + outputHashing: 'none', + optimization: false, + }) + ] + }; + };` + ); + + const result = runCLI(`build ${appName}`); + expect(result).toContain( + `Successfully ran target build for project ${appName}` + ); + }); + + it('should support an array of standard config objects', () => { + const appName = uniq('app'); + const serverName = uniq('server'); + + runCLI( + `generate @nx/react:application --directory=apps/${appName} --bundler=webpack --e2eTestRunner=none` + ); + + // Create server index file + createFile( + `apps/${serverName}/index.js`, + `console.log('Hello from ${serverName}');\n` + ); + + updateFile( + `apps/${appName}/webpack.config.js`, + ` + const path = require('path'); + const { NxAppWebpackPlugin } = require('@nx/webpack/app-plugin'); + + module.exports = [ + { + name: 'client', + target: 'node', + output: { + path: path.join(__dirname, '../../dist/${appName}') + }, + plugins: [ + new NxAppWebpackPlugin({ + compiler: 'tsc', + main: './src/main.tsx', + tsConfig: './tsconfig.app.json', + outputHashing: 'none', + optimization: false, + }) + ] + }, { + name: 'server', + target: 'node', + entry: '../${serverName}/index.js', + output: { + path: path.join(__dirname, '../../dist/${serverName}'), + filename: 'index.js', + }, + } + ]; + ` + ); + + const result = runCLI(`build ${appName}`); + + checkFilesExist(`dist/${appName}/main.js`); + checkFilesExist(`dist/${serverName}/index.js`); + + expect(result).toContain( + `Successfully ran target build for project ${appName}` + ); + }); + + it('should support a function that returns an array of standard config objects', () => { + const appName = uniq('app'); + const serverName = uniq('server'); + + runCLI( + `generate @nx/react:application --directory=apps/${appName} --bundler=webpack --e2eTestRunner=none` + ); + + // Create server index file + createFile( + `apps/${serverName}/index.js`, + `console.log('Hello from ${serverName}');\n` + ); + + updateFile( + `apps/${appName}/webpack.config.js`, + ` + const path = require('path'); + const { NxAppWebpackPlugin } = require('@nx/webpack/app-plugin'); + + module.exports = () => { + return [ + { + name: 'client', + target: 'node', + output: { + path: path.join(__dirname, '../../dist/${appName}') + }, + plugins: [ + new NxAppWebpackPlugin({ + compiler: 'tsc', + main: './src/main.tsx', + tsConfig: './tsconfig.app.json', + outputHashing: 'none', + optimization: false, + }) + ] + }, + { + name: 'server', + target: 'node', + entry: '../${serverName}/index.js', + output: { + path: path.join(__dirname, '../../dist/${serverName}'), + filename: 'index.js', + } + } + ]; + };` + ); + const result = runCLI(`build ${appName}`); + + checkFilesExist(`dist/${serverName}/index.js`); + checkFilesExist(`dist/${appName}/main.js`); + + expect(result).toContain( + `Successfully ran target build for project ${appName}` + ); + }); + }); }); function readMainFile(dir: string): string {