Question

我正在使用vue-cli lib模式+ webpack创建NPM软件包。我旨在为SSR和客户端使用创建一个vue.js插件。该应用程序按以下方式导出4个程序包

myPackage.common.js
myPackage.umd.jd
myPackage-ssr.common.js
myPackage-ssr.umd.js

如果我至少不包括common + ssr，则该插件无法正常工作。只能用于服务器端或客户端。当我添加两个文件时，它适用于两种情况。我不确定为什么需要包含2个文件。

我的计划是在嵌入CSS的同时为SSR和客户端都只有一个文件。

我的webpack配置在这里

module.exports = {
    css: {
        extract: false,
    },
    configureWebpack: {
        target: TARGET_NODE ? 'node' : 'web',
        node: TARGET_NODE ? undefined : false,
        output: {
            library: 'myPackage',
            libraryExport: 'default',
            libraryTarget: TARGET_NODE ? 'umd' : undefined,
        },
    },
    chainWebpack: (config) => {
        config.module
        .rule('vue')
        .use('vue-loader')
        .tap(options => Object.assign(options, { optimizeSSR: false }));
    },
};

我的package.json脚本是

"build": "npm run build:server -- --silent && npm run build:client -- --no-clean --silent",
"build:client": "vue-cli-service build --target lib --name myPackage ./src/components/index.js",
"build:server": "cross-env WEBPACK_TARGET=node vue-cli-service build --target lib --name myPackage-ssr ./src/components/index.js",

我想念什么？干杯

用于SSR npm软件包的webpack 4配置

0 个答案: