vite@4.4.9+element-plus@^2.3.12+path-browserify@^1.0.1 使用报错解决办法

### 基础环境
```
vite@4.4.9
element-plus@^2.3.12
path-browserify@^1.0.1
```

vite 移除了node的垫片包， 所以 , 所以，在使用 path-browserify 一定会报错， `process is not defined`

### 解决办法
源码中， 作者没有去处理这个问题，那么， 我们将源码中的 resolve方法 copy到项目中即可

说白了 你就是要解决 path.resolve(‘/a’, 'b') --> /a/b 这个问题

#### 第一步

复制 `normalizeStringPosix `方法 和 `resolve` 方法 到你项目的utils 里面，作为一个工具包

```js

function normalizeStringPosix(path, allowAboveRoot) {
var res = '';
var lastSegmentLength = 0;
var lastSlash = -1;
var dots = 0;
var code;
for (var i = 0; i <= path.length; ++i) {
if (i < path.length)
code = path.charCodeAt(i);
else if (code === 47 /*/*/)
break;
else
code = 47 /*/*/;
if (code === 47 /*/*/) {
if (lastSlash === i - 1 || dots === 1) {
// NOOP
} else if (lastSlash !== i - 1 && dots === 2) {
if (res.length < 2 || lastSegmentLength !== 2 || res.charCodeAt(res.length - 1) !== 46 /*.*/ || res.charCodeAt(res.length - 2) !== 46 /*.*/) {
if (res.length > 2) {
var lastSlashIndex = res.lastIndexOf('/');
if (lastSlashIndex !== res.length - 1) {
if (lastSlashIndex === -1) {
res = '';
lastSegmentLength = 0;
} else {
res = res.slice(0, lastSlashIndex);
lastSegmentLength = res.length - 1 - res.lastIndexOf('/');
}
lastSlash = i;
dots = 0;
continue;
}
} else if (res.length === 2 || res.length === 1) {
res = '';
lastSegmentLength = 0;
lastSlash = i;
dots = 0;
continue;
}
}
if (allowAboveRoot) {
if (res.length > 0)
res += '/..';
else
res = '..';
lastSegmentLength = 2;
}
} else {
if (res.length > 0)
res += '/' + path.slice(lastSlash + 1, i);
else
res = path.slice(lastSlash + 1, i);
lastSegmentLength = i - lastSlash - 1;
}
lastSlash = i;
dots = 0;
} else if (code === 46 /*.*/ && dots !== -1) {
++dots;
} else {
dots = -1;
}
}
return res;
}

/**
* link 代码来源 path-browserify@1.0.1 包
* @returns
*/
export function resolve() {
var resolvedPath = '';
var resolvedAbsolute = false;
var cwd;

for (var i = arguments.length - 1; i >= -1 && !resolvedAbsolute; i--) {
var path;
if (i >= 0)
path = arguments[i];
else {
if (cwd === undefined)
// cwd = process.cwd();
path = '';
}

// Skip empty entries
if (path.length === 0) {
continue;
}

resolvedPath = path + '/' + resolvedPath;
resolvedAbsolute = path.charCodeAt(0) === 47 /*/*/;
}

// At this point the path should be resolved to a full absolute path, but
// handle relative paths to be safe (might happen when process.cwd() fails)

// Normalize the path
resolvedPath = normalizeStringPosix(resolvedPath, !resolvedAbsolute);

if (resolvedAbsolute) {
if (resolvedPath.length > 0)
return '/' + resolvedPath;
else
return '/';
} else if (resolvedPath.length > 0) {
return resolvedPath;
} else {
return '.';
}
}

```

第二步： 注释有关 process相关的，其实就一行， 然后将 `path = ''`

### 使用

```html

import { isExternal, resolve} from '@/utils/index.js'

const resolvePath = routePath => {
if (isExternal(routePath)) {
return routePath
}

if (isExternal(props.basePath)) {
return props.basePath
}

const fullPath = resolve(props.basePath, routePath)

console.log(fullPath);

return fullPath
}

```

我看有评论说 ， 在` vite.config.js ` 给全局注入一个`process `空对象，其实这里会执行 `process.cwd()` , `空对象.cwd()` 执行方法也会报错，除非提供完整的, 这个其实麻烦了一些。 可能还有直接引入 Node的 pollyfill 包， 也不是很好

使用demo

```js
console.log(`示例：resolve('/a', 'b')， 结果：`,resolve('/a', 'b'));

console.log(`示例：resolve('/a', 'b', 'c') 结果：`,resolve('/a', 'b', 'c'));

console.log(`示例：resolve('/a', '/b') 结果：`, resolve('/a', '/b'));
console.log(`示例：resolve('a', 'b') 结果：`,resolve('a', 'b'));

```

输出:

```js
示例：resolve('/a', 'b')， 结果： /a/b
示例：resolve('/a', 'b', 'c') 结果： /a/b/c
示例：resolve('/a', '/b') 结果： /b
示例：resolve('a', 'b') 结果： a/b
```

解决问题不易： 如果可以， 掘金给我一个小小的 star [掘金地址](https://juejin.cn/user/2436173498942055) ，谢谢

El issue menciona Vite 4.4.9, element-plus ^2.3.12 y path-browserify ^1.0.1, pero no indica ningún archivo ni prueba del repositorio. Empieza reproduciendo el error «process is not defined» en una compilación de navegador de Vite e inspeccionando la entrada del paquete que utiliza esa compilación. No está claro cuándo se consideraría terminado, porque el informe documenta una solución alternativa del lado de la aplicación en lugar de un cambio solicitado en el repositorio.

Escrito por el modelo de indexación a partir del texto del issue.