如何仅使用 webpack 捆绑 node_modules？答案

【问题标题】：How to use webpack bundle only node_modules?如何仅使用 webpack 捆绑 node_modules？
【发布时间】：2019-05-23 22:44:06
【问题描述】：

我想将我的 vue ssr server.js 捆绑在一起，将所有 node_modules 包含到一个文件中

我已经将我的服务器和客户端代码构建到dist/ 文件夹中

现在，我想在 docker 镜像中构建代码

我不想在最终图像中包含node_modules 文件夹（太大）

所以我决定捆绑我的server.js

捆绑后，我将在最终图像中删除node_modules。

但是在我的server.js

const express = require('express')
const bundle = require('./dist/vue-ssr-server-bundle.json')

它需要我的 dist/ js ，我不希望 webpack 捆绑 dist/ 文件夹内容只有 node_modules 像 express 一样

仅捆绑node_modules

等了很久

我收到了

Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

这是我的 webpack 配置

const path = require('path')

const resolve = (...dir) => path.resolve(...dir)

module.exports = {
    entry: resolve(__dirname, '../server.js'),
    output: {
        filename: 'bundled-server.js',
        path: resolve(__dirname, '../')
    },
    mode: 'production',
    target: 'node',
    resolve: {
        extensions: ['.tsx', '.ts', '.js'],
        alias: {
        }
    },
    module: {
        rules: [
            {
                use: 'babel-loader',
                test: /\.js$/,
                exclude: /node_module/
            },
        ]
    },
}

我的文件夹结构

我的问题

如何让 webpack 只捆绑 node_modules 和 server.js，除了我的 dist/ 文件夹？

对不起我的英语不好

【问题讨论】：

标签： docker vue.js webpack

【解决方案1】：

Webpack 将你所有的源代码打包并放入dist 文件夹。当您使用它构建最终的 Docker 映像时，您希望忽略 node_modules 和其他不必要的目录。这就是.dockerignore 文件可以帮助您的地方。就像.gitignore 一样，.dockerignore 在构建过程中会忽略文件。在.dockerignore 文件中提及您要忽略的文件。

【讨论】：

如何忽略dist/ 文件夹？我不希望 webpack 捆绑我导入的 dist 文件夹文件，例如 require('./dist/......') 我想 webpack 忽略所有以 ./dist 开头的导入我只想 webpack 捆绑 node_modules 和 server.js 本身