Question

我有一个电子应用程序，我正在使用webpack 2.我有一个配置文件，我包括像一个普通的webpack资源：

config.js:

export default {
    config1: 1,
    config2: 2
}

main.js:

import config from '../some/path/config';
console.log(config.config1);

配置文件代码最终出现在我的bundle.js文件中，正如您所期望的那样。问题是配置文件的重点是您可以在部署后更改它们。如果我希望配置文件更改生效，这个设置需要我重新进行webpackify。

更新1：

我认为file-loader可能是答案，但问题是文件加载器将require语句替换为文件路径，而不是文件内容本身。

更新2：

根据@sancelot的建议，我尝试将它作为一个单独的入口点并输出到我的webpack配置文件中。

entry: {
    main: ['babel-polyfill', path.join(__dirname, '../app/main.js')],
    config: [path.join(__dirname, '../app/config.js')]
},

output: {
    path: `${__dirname}/../build/`,
    publicPath: `${__dirname}/../build/`,
    filename: '../build/[name].bundle.js'
}

确实创建了一个单独的config.bundle.js文件，但main.bundle.js仍然在内部包含了自己的配置文件副本，基本上忽略了config.bundle.js。为了完整起见，我这里是整个webpack配置文件：

import webpack from 'webpack';
import path from 'path';


export default {
    devtool: 'source-map',

    target: 'electron-main',

    entry: {
        main: ['babel-polyfill', path.join(__dirname, '../app/main.js')],
        config: [path.join(__dirname, '../app/config.js')]
    },

    output: {
        path: `${__dirname}/../build/`,
        publicPath: `${__dirname}/../build/`,
        filename: '../build/[name].bundle.js'
    },

    module: {
        rules: [
            {
                test: /\.(js|jsx)$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        cacheDirectory: true
                    }
                }
            },
            {
                test: /index.html/,
                use: {
                    loader: 'file-loader',
                    options: {
                        name: 'index.html'
                    }
                }
            }
        ]
    },

    plugins: [
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'production'),
            'process.env.devMode': process.env.NODE_ENV === 'development',
            'process.env.prodMode': process.env.NODE_ENV === 'production',
            'process.env.DEBUG_PROD': JSON.stringify(process.env.DEBUG_PROD || 'false')
        })
    ],

    node: {
        __dirname: false,
        __filename: false
    },
}

Answer 1

您必须在webpack配置中添加一个条目

{{1}}

https://webpack.js.org/concepts/output/

Answer 2

对于这种情况，我建议dotenv

对于客户端应用程序（在浏览器中运行），我建议envify。

这两项建议都很容易遵循设置指南。

使用webpack处理配置文件

更新1：

更新2：

2 个答案: