1

我有一个与How to config webpack - libraryTarget + splitChunks + requaire in borwser类似的问题。我写了一个 npm 插件并通过 webpack 编译它。接下来,我将它安装在 Nuxt 项目中,并在(例如)index.vue 中添加到这个 npm 插件的导入。插件 src 文件看起来像

import 'fetch';

export class Tools...

等如果我不使用 splitChunks 一切正常(import { Tools } from 'libs/dist/.../tools'),但使用 splitChunks 我有 undefined/1/end 循环加载 Nuxt 应用程序/空模型等。

output: {
    filename: env.target_build === 'prod' && env.add_name_min === 'true'  ?
        'js/web/[name].min.js' : 'js/web/[name].js',
    chunkFilename: env.target_build === 'prod' && env.add_name_min === 'true'  ?
        'js/web/[name].min.js' : 'js/web/[name].js',
    publicPath: 'dist/',
    libraryTarget: 'umd',
    // library: 'libs',
    // umdNamedDefine: true
},
// optimization: {
//     runtimeChunk: 'single',
//     splitChunks: {
//         chunks: 'all',
//         maxInitialRequests: Infinity,
//         minSize: 0,
//         cacheGroups: {
//             vendor: {
//                 test: /[\\/]node_modules[\\/]/,
//                 name(module) {
//                     let pathSplit = module.context.match(/[\\/]node_modules[\\/]([^\/]+)\/(?!node_modules\/)([^\/]+)\/?([^\/]+)?/);

//                     if (pathSplit === null) {
//                         return 'name';
//                     } else if (pathSplit[3] === undefined) {
//                         // npm package names are URL-safe, but some servers don't like @ symbols
//                         return `npm.${pathSplit[1].replace('@', '')}`;
//                     } else {
//                         return `${pathSplit[3].replace('@', '')}.${pathSplit[1].replace('@', '')}`;
//                     }
//                 },
//             }
//         },
//     },
// },

如果没有 runtimeChunk,我认为我只需要从“libs/dist/.../tools”导入(例如)工具,并且将加载工具的所有块。Tools2 等也是如此。对于 runtimeChunk,我认为我必须从运行时导入,import { Tools } from 'libs/dist/.../runtime'但不......两个导入都不起作用。那么,可以从另一个 webpack 包中导入拆分文件吗?

我发现的类似问题:
Dynamic Module Import with its own chunk dependencies
Importing/loading library with chunks

4

0 回答 0