最近在使用vue打包前端項目的時候，遇到了一個問題：打包出來的代碼在360瀏覽器上無法運行，而在其他瀏覽器上可以正常展示。

經過排查，發現問題出現在vue打包的過程中。具體來說，是由于360瀏覽器對Javascript的支持技術不夠完善，而vue默認使用了ES6的一些新特性，這導致360瀏覽器無法正確解析并運行打包出來的代碼。

// 以下是代碼示例
const arr = [1, 2, 3]
const newArr = arr.map(item =>item * 2)
console.log(newArr)

在這段代碼中，我們使用了ES6的箭頭函數和數組的新方法map來遍歷數組并生成新數組。但是這些新特性對于一些老的瀏覽器來說可能無法正確解析并運行。而360瀏覽器的Javascript引擎就是一例。

為了解決這個問題，我們需要對vue的打包配置進行修改，確保生成的代碼可以在360瀏覽器上正確運行。

首先，我們可以在項目的根目錄下添加一個.browserslistrc文件，用來告訴webpack需要兼容哪些瀏覽器。

# .browserslistrc 文件示例
last 2 versions
>1%

這個文件中，我們可以指定webpack需要兼容的瀏覽器版本。這里我們使用了last 2 versions和>1%這兩個條件，表示需要兼容最新的兩個版本以及全球使用率超過1%的瀏覽器。

然后，我們還可以使用babel來對ES6的代碼進行轉換。在項目的根目錄下創建.babelrc文件，內容如下：

{
"presets": ["@babel/preset-env"]
}

這個文件告訴babel需要使用@babel/preset-env這個preset來編譯代碼。這個preset會根據我們在.browserslistrc中指定的瀏覽器版本，自動選擇需要的polyfill和轉換規則，確保ES6的代碼能夠在不同的瀏覽器上正確運行。

最后，我們需要修改webpack的配置，在生成的代碼中不再使用ES6的語法。具體來說，我們需要在webpack的配置文件中添加一個babel-loader，并指定exclude項，確保不對node_modules中的依賴進行編譯。示例代碼如下：

// webpack.config.js 文件示例
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
}
]
}

通過以上修改，我們就能夠確保vue打包出來的代碼能夠在360瀏覽器上正確運行了。同時，這些改動也能夠使得我們的代碼更加兼容性，可以在更多的瀏覽器上正常運行。