Vue 3 - 如何將 Polyfill 新增至 ChainWebpack
P粉268654873
P粉268654873 2024-03-25 19:45:09
0
2
583

使用 Vue 3,如何將 path-browserify 加入 vue.config.js?

module.exports = {
    chainWebpack: config => {}
}

編譯時出現以下錯誤:

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
        - install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "path": false }

P粉268654873
P粉268654873

全部回覆(2)
P粉797004644

Webpack 5 刪除了 Webpack 4 套件中包含的一些內容。

要將其全部還原到 vue3 應用程式中,您可以使用 polyfill 外掛程式。 來自帶有 babel 的普通 create-vue-app:

> npm i node-polyfill-webpack-plugin

babel.config.js

module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ]
}

vue.config.js

const { defineConfig } = require("@vue/cli-service");
const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
module.exports = defineConfig({
  transpileDependencies: true,
  configureWebpack: {
    plugins: [new NodePolyfillPlugin()],
    optimization: {
      splitChunks: {
        chunks: "all",
      },
    },
  },
});
P粉899950720

在@Zack的幫助下,使用chainWebpack

const NodePolyfillPlugin = require('node-polyfill-webpack-plugin')

module.exports = {
    chainWebpack: config => {
        config.plugin('polyfills').use(NodePolyfillPlugin)
    },
}
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板