fix: handle + symbol in package subpath exports during dep optimization

packages/vite/src/node/__tests__/utils.spec.ts

@@ -668,6 +668,14 @@ describe('flattenId', () => {
     const result2 = flattenId(id)
     expect(result2).toHaveLength(170)
   })
+
+  test('should replace + symbols in package subpath exports', () => {
+    // Packages like ravelinjs use + in their subpath exports
+    const id = 'ravelinjs/core+track+encrypt+promise'
+    const result = flattenId(id)
+    expect(result).not.toContain('+')
+    expect(result).toBe('ravelinjs_core_____track_____encrypt_____promise')
+  })
 })
 
 describe('mergeWithDefaults', () => {

packages/vite/src/node/utils.ts

@@ -70,13 +70,15 @@ const replaceSlashOrColonRE = /[/:]/g
 const replaceDotRE = /\./g
 const replaceNestedIdRE = /\s*>\s*/g
 const replaceHashRE = /#/g
+const replacePlusRE = /\+/g
 export const flattenId = (id: string): string => {
   const flatId = limitFlattenIdLength(
     id
       .replace(replaceSlashOrColonRE, '_')
       .replace(replaceDotRE, '__')
       .replace(replaceNestedIdRE, '___')
-      .replace(replaceHashRE, '____'),
+      .replace(replaceHashRE, '____')
+      .replace(replacePlusRE, '_____'),
   )
   return flatId
 }

playground/optimize-deps/__tests__/optimize-deps.spec.ts

@@ -221,6 +221,9 @@ test('flatten id should generate correctly', async () => {
   await expect
     .poll(() => page.textContent('.clonedeep-dot'))
     .toBe('clonedeep-dot')
+  await expect
+    .poll(() => page.textContent('.dep-with-plus-subpath'))
+    .toBe('plus-subpath')
 })
 
 test('non optimized module is not duplicated', async () => {

playground/optimize-deps/dep-with-plus-subpath/core+feature.js

@@ -0,0 +1 @@
+export const msg = 'plus-subpath'

playground/optimize-deps/dep-with-plus-subpath/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "@vitejs/test-dep-with-plus-subpath",
+  "private": true,
+  "version": "0.0.0",
+  "exports": {
+    "./core+feature": "./core+feature.js"
+  }
+}

playground/optimize-deps/index.html

@@ -112,6 +112,7 @@ <h2>Reused variable names</h2>
 <h2>Flatten Id</h2>
 <div class="clonedeep-slash"></div>
 <div class="clonedeep-dot"></div>
+<div class="dep-with-plus-subpath"></div>
 
 <h2>Non Optimized Module isn't duplicated</h2>
 <div class="non-optimized-module-is-not-duplicated"></div>
@@ -334,9 +335,11 @@ <h2>Import the CommonJS external package that omits the js suffix</h2>
 <script type="module">
   import cloneDeepSlash from 'lodash/cloneDeep'
   import cloneDeepDot from 'lodash.clonedeep'
+  import { msg as plusSubpath } from '@vitejs/test-dep-with-plus-subpath/core+feature'
 
   text('.clonedeep-slash', cloneDeepSlash({ name: 'clonedeep-slash' }).name)
   text('.clonedeep-dot', cloneDeepDot({ name: 'clonedeep-dot' }).name)
+  text('.dep-with-plus-subpath', plusSubpath)
 </script>
 
 <script type="module">

playground/optimize-deps/package.json

@@ -42,6 +42,7 @@
     "@vitejs/test-dep-with-optional-peer-dep": "file:./dep-with-optional-peer-dep",
     "@vitejs/test-dep-with-optional-peer-dep-cjs": "file:./dep-with-optional-peer-dep-cjs",
     "@vitejs/test-dep-with-optional-peer-dep-submodule": "file:./dep-with-optional-peer-dep-submodule",
+    "@vitejs/test-dep-with-plus-subpath": "file:./dep-with-plus-subpath",
     "@vitejs/test-dep-non-optimized": "file:./dep-non-optimized",
     "@vitejs/test-added-in-entries": "file:./added-in-entries",
     "@vitejs/test-dep-cjs-external-package-omit-js-suffix": "file:./dep-cjs-external-package-omit-js-suffix",