1. ホーム

vue cli2, cli3 コンパイル(パッケージ化)された chunk-vendors.js ファイルが es6 構文で存在する。

2022-02-25 15:21:24

ただ、プロジェクトのビルドチャンク- vendors.jsファイルが常に完全に解決するための方法を考え崩壊寸前で、es6構文を存在していた後にプロジェクトを構築するためにバーの足場を使用して、大きな穴を踏んで、以下は、解決策の手順です。

1. vue パッケージングは node_modules のコードをコンパイルしません。コード内に node_modules の参照がある場合、そのコードはビルド後に直接マージされ、babel によって解析されません。

2. そこで根本的な原因を見つけ、node_modulesのどのパッケージやコードがバベル化されていないのかを見つけ、そのパッケージをwebpack.base.conf.jsのbabel-loaderのincludeに追加してバベルでパースさせる必要があるのだそうです。

コードはこのようになります。

module: {
    rules: [
      {
        test: /\.js$/,
        loader: "babel-loader",
        include: [
          resolve("src"),
          resolve("test"),
          resolve("node_modules/webpack-dev-server/client"),
          resolve("node_modules/webpack/lib/ModuleFilenameHelpers.js")
        ]
      },
    ]
}

vue-cli3 は公式サイトの webpack 関連の設定を参照して、loader を変更することができます。

公式サイト関連のアドレスです。 https://cli.vuejs.org/zh/guide/webpack.html#%E9%93%BE%E5%BC%8F%E6%93%8D%E4%BD%9C-%E9%AB%98%E7%BA%A7