archive/rsnext
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: support import attributes (#59480)

Browse source 
### What?

Add support to import attributes.

### Why?

The old import assertions syntax is deprecated and the proposal is
updated. See https://github.com/babel/babel/pull/15536

### How?

Add support to import attributes and keep old import assertions working
by using `@babel/plugin-syntax-import-attributes` with the
`deprecatedAssertSyntax` option.

Docs: https://babeljs.io/docs/babel-plugin-syntax-import-attributes

---------

Co-authored-by: Jiachi Liu <inbox@huozhi.im>
Co-authored-by: Steven <steven@ceriously.com>
This commit is contained in:
C. T. Lin 2024-04-24 23:55:32 +08:00 committed by GitHub
parent 909789aaf4
commit 5caeea398a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
19 changed files with 98 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
.prettierignore
View file

@ -32,6 +32,9 @@ packages/next-env/**/*.d.ts
test/**/out/**
test/development/basic/hmr/components/parse-error.js
# TODO: upgrade prettier to 3.1.1 to support import attributes
test/integration/import-attributes/**/*
bench/nested-deps/pages/**/*
bench/nested-deps/components/**/*

2
packages/next/package.json
View file

@ -131,7 +131,7 @@
"@babel/plugin-proposal-object-rest-spread": "7.20.7",
"@babel/plugin-syntax-bigint": "7.8.3",
"@babel/plugin-syntax-dynamic-import": "7.8.3",
"@babel/plugin-syntax-import-assertions": "7.22.5",
"@babel/plugin-syntax-import-attributes": "7.22.5",
"@babel/plugin-syntax-jsx": "7.22.5",
"@babel/plugin-transform-modules-commonjs": "7.22.5",
"@babel/plugin-transform-runtime": "7.22.5",

7
packages/next/src/build/babel/preset.ts
View file

@ -154,7 +154,12 @@ export default (
},
],
require('next/dist/compiled/babel/plugin-syntax-dynamic-import'),
require('next/dist/compiled/babel/plugin-syntax-import-assertions'),
[
require('next/dist/compiled/babel/plugin-syntax-import-attributes'),
{
deprecatedAssertSyntax: true,
},
],
require('./plugins/react-loadable-plugin'),
[
require('next/dist/compiled/babel/plugin-proposal-class-properties'),

6
packages/next/src/bundles/babel/bundle.js
View file

@ -72,8 +72,8 @@ function pluginSyntaxDynamicImport() {
return require('next/dist/compiled/babel-packages').pluginSyntaxDynamicImport()
}
function pluginSyntaxImportAssertions() {
return require('next/dist/compiled/babel-packages').pluginSyntaxImportAssertions()
function pluginSyntaxImportAttributes() {
return require('next/dist/compiled/babel-packages').pluginSyntaxImportAttributes()
}
function pluginSyntaxJsx() {
@ -127,7 +127,7 @@ module.exports = {
pluginProposalObjectRestSpread,
pluginSyntaxBigint,
pluginSyntaxDynamicImport,
pluginSyntaxImportAssertions,
pluginSyntaxImportAttributes,
pluginSyntaxJsx,
pluginTransformDefine,
pluginTransformModulesCommonjs,

6
packages/next/src/bundles/babel/packages-bundle.js
View file

@ -28,8 +28,8 @@ function pluginSyntaxDynamicImport() {
return require('@babel/plugin-syntax-dynamic-import')
}
function pluginSyntaxImportAssertions() {
return require('@babel/plugin-syntax-import-assertions')
function pluginSyntaxImportAttributes() {
return require('@babel/plugin-syntax-import-attributes')
}
function pluginSyntaxJsx() {
@ -72,7 +72,7 @@ module.exports = {
pluginProposalObjectRestSpread,
pluginSyntaxBigint,
pluginSyntaxDynamicImport,
pluginSyntaxImportAssertions,
pluginSyntaxImportAttributes,
pluginSyntaxJsx,
pluginTransformDefine,
pluginTransformModulesCommonjs,

1
packages/next/src/bundles/babel/packages/plugin-syntax-import-assertions.js
View file

@ -1 +0,0 @@
module.exports = require('./bundle').pluginSyntaxImportAssertions()

1
packages/next/src/bundles/babel/packages/plugin-syntax-import-attributes.js Normal file
View file

@ -0,0 +1 @@
module.exports = require('./bundle').pluginSyntaxImportAttributes()

6
packages/next/src/compiled/babel-packages/packages-bundle.js
View file

File diff suppressed because one or more lines are too long

2
packages/next/src/compiled/babel/bundle.js
View file

File diff suppressed because one or more lines are too long

1
packages/next/src/compiled/babel/plugin-syntax-import-assertions.js
View file

@ -1 +0,0 @@
module.exports = require('./bundle').pluginSyntaxImportAssertions()

1
packages/next/src/compiled/babel/plugin-syntax-import-attributes.js Normal file
View file

@ -0,0 +1 @@
module.exports = require('./bundle').pluginSyntaxImportAttributes()

31
pnpm-lock.yaml
View file

@ -872,7 +872,7 @@ importers:
'@babel/plugin-syntax-dynamic-import':
specifier: 7.8.3
version: 7.8.3(@babel/core@7.22.5)
'@babel/plugin-syntax-import-assertions':
'@babel/plugin-syntax-import-attributes':
specifier: 7.22.5
version: 7.22.5(@babel/core@7.22.5)
'@babel/plugin-syntax-jsx':
@ -2112,7 +2112,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
dev: true
/@babel/plugin-proposal-class-properties@7.12.1(@babel/core@7.22.5):
@ -2123,7 +2123,7 @@ packages:
dependencies:
'@babel/core': 7.22.5
'@babel/helper-create-class-features-plugin': 7.22.1(@babel/core@7.22.5)
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
transitivePeerDependencies:
- supports-color
dev: true
@ -2196,6 +2196,7 @@ packages:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.22.5
'@babel/plugin-syntax-logical-assignment-operators': 7.10.4(@babel/core@7.22.5)
'@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3(@babel/core@7.22.5)
/@babel/plugin-proposal-nullish-coalescing-operator@7.16.7(@babel/core@7.22.5):
resolution: {integrity: sha512-aUOrYU3EVtjf62jQrCj63pYZ7k6vns2h/DQvHPWGmsJRYzWXZ6/AsfgpiRy6XiuIDADhJzP2Q9MwSMKauBQ+UQ==}
@ -2349,7 +2350,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
/@babel/plugin-syntax-flow@7.16.7(@babel/core@7.22.5):
resolution: {integrity: sha512-UDo3YGQO0jH6ytzVwgSLv9i/CzMcUjbKenL67dTrAZPPv6GFAtDhe6jqnvmoKzC/7htNTohhos+onPtDMqJwaQ==}
@ -2358,7 +2359,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
/@babel/plugin-syntax-flow@7.22.5(@babel/core@7.22.5):
resolution: {integrity: sha512-9RdCl0i+q0QExayk2nOS7853w08yLucnnPML6EN9S8fgMPVtdLDCdx/cOQ/i44Lb9UeQX9A35yaqBBOMMZxPxQ==}
@ -2435,7 +2436,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
/@babel/plugin-syntax-object-rest-spread@7.8.3(@babel/core@7.22.5):
resolution: {integrity: sha512-XoqMijGZb9y3y2XskN+P1wUGiVwWZ5JmoDRwx5+3GmEplNyVM2s2Dg8ILFQm8rWM48orGy5YpI5Bl8U1y7ydlA==}
@ -2443,7 +2444,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
/@babel/plugin-syntax-optional-catch-binding@7.8.3(@babel/core@7.22.5):
resolution: {integrity: sha512-6VPD0Pc1lpTqw0aKoeRTMiB+kWhAoT24PA+ksWSBrFtl5SIRVpZlwN3NNPQjehA2E/91FV3RjLWoVTglWcSV3Q==}
@ -2459,7 +2460,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
/@babel/plugin-syntax-private-property-in-object@7.14.5(@babel/core@7.22.5):
resolution: {integrity: sha512-0wVnp9dxJ72ZUJDV27ZfbSj6iHLoytYZmh3rFcxNnvsJF3ktkzLDZPy/mA17HGsaQT3/DQsWYX1f1QGWkCoVUg==}
@ -2661,7 +2662,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
'@babel/plugin-syntax-flow': 7.16.7(@babel/core@7.22.5)
/@babel/plugin-transform-flow-strip-types@7.22.5(@babel/core@7.22.5):
@ -2887,7 +2888,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
dev: true
/@babel/plugin-transform-private-methods@7.22.5(@babel/core@7.22.5):
@ -2928,7 +2929,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
dev: true
/@babel/plugin-transform-react-display-name@7.22.5(@babel/core@7.22.5):
@ -2960,7 +2961,7 @@ packages:
'@babel/core': 7.22.5
'@babel/helper-annotate-as-pure': 7.16.7
'@babel/helper-module-imports': 7.21.4
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
'@babel/plugin-syntax-jsx': 7.22.5(@babel/core@7.22.5)
'@babel/types': 7.22.5
dev: true
@ -3010,7 +3011,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
regenerator-transform: 0.15.0
dev: true
@ -3244,7 +3245,7 @@ packages:
'@babel/core': 7.22.5
dependencies:
'@babel/core': 7.22.5
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
'@babel/helper-validator-option': 7.21.0
'@babel/plugin-transform-flow-strip-types': 7.16.7(@babel/core@7.22.5)
@ -8537,7 +8538,7 @@ packages:
resolution: {integrity: sha512-Y1IQok9821cC9onCx5otgFfRm7Lm+I+wwxOx738M/WLPZ9Q42m4IG5W0FNX8WLL2gYMZo3JkuXIH2DOpWM+qwA==}
engines: {node: '>=8'}
dependencies:
'@babel/helper-plugin-utils': 7.21.5
'@babel/helper-plugin-utils': 7.22.5
'@istanbuljs/load-nyc-config': 1.0.0
'@istanbuljs/schema': 0.1.2
istanbul-lib-instrument: 5.2.0

3
test/integration/import-attributes/data Normal file
View file

@ -0,0 +1,3 @@
{
"foo": "foo"
}

2
test/integration/import-attributes/data.d.ts vendored Normal file
View file

@ -0,0 +1,2 @@
declare const data: any
export default data

5
test/integration/import-attributes/pages/es.js Normal file
View file

@ -0,0 +1,5 @@
import data from '../data' with { type: 'json' }
export default function Es() {
return data.foo
}

5
test/integration/import-attributes/pages/ts.ts Normal file
View file

@ -0,0 +1,5 @@
import data from '../data' with { type: 'json' }
export default function Ts() {
return data.foo
}

16
test/integration/import-attributes/test/index.test.js Normal file
View file

@ -0,0 +1,16 @@
import { join } from 'path'
import { renderViaHTTP, runDevSuite, runProdSuite } from 'next-test-utils'
const appDir = join(__dirname, '../')
function basic(context) {
it('should handle json attributes', async () => {
const esHtml = await renderViaHTTP(context.appPort, '/es')
const tsHtml = await renderViaHTTP(context.appPort, '/ts')
expect(esHtml).toContain('foo')
expect(tsHtml).toContain('foo')
})
}
runDevSuite('import-attributes', appDir, { runTests: basic })
runProdSuite('import-attributes', appDir, { runTests: basic })

20
test/integration/import-attributes/tsconfig.json Normal file
View file

@ -0,0 +1,20 @@
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": false,
"forceConsistentCasingInFileNames": true,
"noEmit": true,
"incremental": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve"
},
"exclude": ["node_modules"],
"include": ["**/*.d.ts", "**/*.ts", "**/*.tsx"]
}

9
test/turbopack-build-tests-manifest.json
View file

@ -11417,6 +11417,15 @@
"flakey": [],
"runtimeError": false
},
"test/integration/import-attributes/test/index.test.js": {
"passed": ["import-attributes dev should handle json attributes"],
"failed": [
"production mode import-attributes prod should handle json attributes"
],
"pending": [],
"flakey": [],
"runtimeError": false
},
"test/integration/index-index/test/index.test.js": {
"passed": [
"nested index.js production mode should 404 on /index/index/index",