miel.truyen/nx
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

fix(react): add typings to types instead of files (#18501)

Browse Source
This commit is contained in:
Nicholas Cunningham 2023-08-07 12:41:37 -06:00 committed by GitHub
parent e57d42cf09
commit 85f4737b37
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 140 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
packages/next/src/generators/library/library.spec.ts
View File

@ -29,17 +29,10 @@ describe('next library', () => {
...baseOptions,
name: 'myLib',
});
const tsconfigFiles = readJson(
appTree,
'libs/my-lib/tsconfig.lib.json'
).files;
const tsconfigTypes = readJson(appTree, 'libs/my-lib/tsconfig.lib.json')
.compilerOptions.types;
expect(tsconfigFiles).toContain(
'../../node_modules/@nx/next/typings/image.d.ts'
);
expect(tsconfigFiles).not.toContain(
'../../node_modules/@nx/react/typings/image.d.ts'
);
expect(tsconfigTypes).toContain('@nx/next/typings/image.d.ts');
});
it('should add jsxImportSource in tsconfig.json for @emotion/styled', async () => {

18
packages/next/src/generators/library/library.ts
View File

@ -86,18 +86,6 @@ export async function libraryGenerator(host: Tree, rawOptions: Schema) {
host,
joinPathFragments(options.projectRoot, 'tsconfig.lib.json'),
(json) => {
if (!json.files) {
json.files = [];
}
json.files = json.files.map((path: string) => {
if (path.endsWith('react/typings/image.d.ts')) {
return path.replace(
'@nx/react/typings/image.d.ts',
'@nx/next/typings/image.d.ts'
);
}
return path;
});
if (!json.compilerOptions) {
json.compilerOptions = {
types: [],
@ -106,7 +94,11 @@ export async function libraryGenerator(host: Tree, rawOptions: Schema) {
if (!json.compilerOptions.types) {
json.compilerOptions.types = [];
}
json.compilerOptions.types.push('next');
json.compilerOptions.types = [
...json.compilerOptions.types,
'next',
'@nx/next/typings/image.d.ts',
];
return json;
}
);

6
packages/react/migrations.json
View File

@ -107,6 +107,12 @@
"version": "16.7.0-beta.2",
"description": "Add @babel/core to package.json if @babel/preset-react is present",
"implementation": "./src/migrations/update-16-7-0/add-babel-core"
},
"update-16-7-0-add-typings": {
"cli": "nx",
"version": "16.7.0-beta.2",
"description": "Add @nx/react types to tsconfig types array",
"implementation": "./src/migrations/update-16-7-0-add-typings/update-16-7-0-add-typings"
}
},
"packageJsonUpdates": {

2
packages/react/src/generators/application/application.spec.ts
View File

@ -52,6 +52,8 @@ describe('app', () => {
const tsconfigApp = readJson(appTree, 'apps/my-app/tsconfig.app.json');
expect(tsconfigApp.compilerOptions.types).toEqual([
'node',
'@nx/react/typings/cssmodule.d.ts',
'@nx/react/typings/image.d.ts',
'vite/client',
]);
const tsconfigSpec = readJson(appTree, 'apps/my-app/tsconfig.spec.json');

12
packages/react/src/generators/application/files/base-rspack/tsconfig.app.json__tmpl__
View File

@ -2,13 +2,13 @@
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "<%= offsetFromRoot %>dist/out-tsc",
"types": ["node"]
"types": [
"node",
<% if (style === 'styled-jsx') { %>"@nx/react/typings/styled-jsx.d.ts",<% } %>
"@nx/react/typings/cssmodule.d.ts",
"@nx/react/typings/image.d.ts"
]
},
"files": [
<% if (style === 'styled-jsx') { %>"<%= offsetFromRoot %>node_modules/@nx/react/typings/styled-jsx.d.ts",<% } %>
"<%= offsetFromRoot %>node_modules/@nx/react/typings/cssmodule.d.ts",
"<%= offsetFromRoot %>node_modules/@nx/react/typings/image.d.ts"
],
"exclude": ["jest.config.ts","src/**/*.spec.ts", "src/**/*.test.ts", "src/**/*.spec.tsx", "src/**/*.test.tsx", "src/**/*.spec.js", "src/**/*.test.js", "src/**/*.spec.jsx", "src/**/*.test.jsx"],
"include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"]
}

12
packages/react/src/generators/application/files/base-vite/tsconfig.app.json__tmpl__
View File

@ -2,13 +2,13 @@
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "<%= offsetFromRoot %>dist/out-tsc",
"types": ["node"]
"types": [
"node",
<% if (style === 'styled-jsx') { %>"@nx/react/typings/styled-jsx.d.ts",<% } %>
"@nx/react/typings/cssmodule.d.ts",
"@nx/react/typings/image.d.ts"
]
},
"files": [
<% if (style === 'styled-jsx') { %>"<%= offsetFromRoot %>node_modules/@nx/react/typings/styled-jsx.d.ts",<% } %>
"<%= offsetFromRoot %>node_modules/@nx/react/typings/cssmodule.d.ts",
"<%= offsetFromRoot %>node_modules/@nx/react/typings/image.d.ts"
],
"exclude": ["src/**/*.spec.ts", "src/**/*.test.ts", "src/**/*.spec.tsx", "src/**/*.test.tsx", "src/**/*.spec.js", "src/**/*.test.js", "src/**/*.spec.jsx", "src/**/*.test.jsx"],
"include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"]
}

12
packages/react/src/generators/application/files/base-webpack/tsconfig.app.json__tmpl__
View File

@ -2,13 +2,13 @@
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "<%= offsetFromRoot %>dist/out-tsc",
"types": ["node"]
"types": [
"node",
<% if (style === 'styled-jsx') { %>"@nx/react/typings/styled-jsx.d.ts",<% } %>
"@nx/react/typings/cssmodule.d.ts",
"@nx/react/typings/image.d.ts"
]
},
"files": [
<% if (style === 'styled-jsx') { %>"<%= offsetFromRoot %>node_modules/@nx/react/typings/styled-jsx.d.ts",<% } %>
"<%= offsetFromRoot %>node_modules/@nx/react/typings/cssmodule.d.ts",
"<%= offsetFromRoot %>node_modules/@nx/react/typings/image.d.ts"
],
"exclude": ["jest.config.ts","src/**/*.spec.ts", "src/**/*.test.ts", "src/**/*.spec.tsx", "src/**/*.test.tsx", "src/**/*.spec.js", "src/**/*.test.js", "src/**/*.spec.jsx", "src/**/*.test.jsx"],
"include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"]
}

15
packages/react/src/generators/application/lib/update-jest-config.ts
View File

@ -8,16 +8,15 @@ export function updateSpecConfig(host: Tree, options: NormalizedSchema) {
}
updateJson(host, `${options.appProjectRoot}/tsconfig.spec.json`, (json) => {
const offset = offsetFromRoot(options.appProjectRoot);
json.files = [
`${offset}node_modules/@nx/react/typings/cssmodule.d.ts`,
`${offset}node_modules/@nx/react/typings/image.d.ts`,
];
json.types = json.types || [];
if (options.style === 'styled-jsx') {
json.files.unshift(
`${offset}node_modules/@nx/react/typings/styled-jsx.d.ts`
);
json.types.push('@nx/react/typings/styled-jsx.d.ts');
}
json.types = [
...json.types,
'@nx/react/typings/cssmodule.d.ts',
'@nx/react/typings/image.d.ts',
];
return json;
});

48
packages/react/src/migrations/update-16-7-0-add-typings/update-16-7-0-add-typings.spec.ts Normal file
View File

@ -0,0 +1,48 @@
import { Tree, addProjectConfiguration } from '@nx/devkit';
import { createTreeWithEmptyWorkspace } from 'nx/src/devkit-testing-exports';
import addTypings from './update-16-7-0-add-typings';
describe('Add typings to react projects', () => {
let tree: Tree;
beforeEach(() => {
tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
});
it('should update tsconfig to include react typings', async () => {
tree.write(
'package.json',
JSON.stringify({
dependencies: {},
devDependencies: {},
})
);
addProjectConfiguration(tree, 'myapp', {
root: 'myapp',
targets: {
build: {
executor: '@nx/webpack:webpack',
},
},
});
tree.write(
'myapp/tsconfig.app.json',
JSON.stringify({
compilerOptions: {},
})
);
await addTypings(tree);
const tsconfigTypes = JSON.parse(
tree.read('myapp/tsconfig.app.json', 'utf-8')
);
expect(tsconfigTypes.compilerOptions.types).toContain(
'@nx/react/typings/cssmodule.d.ts'
);
expect(tsconfigTypes.compilerOptions.types).toContain(
'@nx/react/typings/image.d.ts'
);
});
});

51
packages/react/src/migrations/update-16-7-0-add-typings/update-16-7-0-add-typings.ts Normal file
View File

@ -0,0 +1,51 @@
import {
Tree,
formatFiles,
getProjects,
joinPathFragments,
updateJson,
} from '@nx/devkit';
export default async function addTypings(tree: Tree) {
const projects = getProjects(tree);
const buildExecutors = [
'@nx/webpack:webpack',
'@nx/vite:build',
'@nx/rspack:rspack',
];
const relatedTsConfigs = [
'tsconfig.app.json',
'tsconfig.lib.json',
'tsconfig.spec.json',
];
const typesToAdd = [
'@nx/react/typings/cssmodule.d.ts',
'@nx/react/typings/image.d.ts',
];
for (const [, config] of projects) {
if (buildExecutors.includes(config?.targets?.build?.executor)) {
const rootPath = config.root;
relatedTsConfigs.forEach((tsConfig) => {
const tsConfigPath = joinPathFragments(rootPath, tsConfig);
if (tree.exists(tsConfigPath)) {
updateJson(tree, tsConfigPath, (json) => {
const compilerOptions = json.compilerOptions || {};
compilerOptions.types = [
...new Set([...(compilerOptions.types || []), ...typesToAdd]),
];
if (json.files?.length > 0) {
json.files = json.files.filter(
(file: string) =>
!['cssmodule.d.ts', 'image.d.ts'].includes(file)
);
}
return { ...json, compilerOptions };
});
}
});
}
}
await formatFiles(tree);
}