Exclude specific file from webpack bundle

Question

In my React app I'm using Webpack. Here is my webpack.config:

"use strict";

var path = require("path");
var WebpackNotifierPlugin = require("webpack-notifier");
var BrowserSyncPlugin = require("browser-sync-webpack-plugin");

module.exports = {
    entry: "./Scripts/reactApp/index.jsx",
    output: {
        path: path.resolve(__dirname, "./Scripts/reactApp/build"),
        filename: "react_bundle.js"
    },
    module: {
        rules: [
            {
                test: /\.jsx$/,
                exclude: [/node_modules/, path.resolve(__dirname, "./Scripts/reactApp/translations/he.translations.json")],
                use: {
                    loader: "babel-loader"
                }
            },
            {
                test: /\.js$/,
                exclude: [/node_modules/, path.resolve(__dirname, "./Scripts/reactApp/translations/he.translations.json")],
                use: {
                    loader: "babel-loader"
                }
            }
        ]
    },
    devtool: "inline-source-map",
    plugins: [new WebpackNotifierPlugin(), new BrowserSyncPlugin()]
};

I'm trying to exclude from bundle he.translations.json But webpack included it whatever.

Can you explain me what I do wrong? Sorry in advance, I'm new in webpack.

Answer 1

You can just do (from webpack docs)

...
exclude: [/node_modules/, path.resolve(__dirname, 'Scripts/reactApp/translations/he.translations.json')],
...

There's no dot in the path and, of course, assuming you have the wepback config file in the proper place.