Webpack-动态需求和路径 [英] Webpack - dynamic require and paths

问题描述

我的webpack.config文件看起来像这样

My webpack.config file looks like this

var path = require('path');
var webpack = require('webpack');

module.exports = {
    entry: {
        app: './app'
    },
    output: {
        path: path.resolve(__dirname, 'build'),
        filename: '[name]-bundle.js'
    }
};

我有一些动态要求，就像这样

I have some dynamic requires that look like this

function loadModule(modName, cb, onErr){
    if (modName == 'contacts') require(['../modules/contacts/contacts', 'html!../modules/contacts/contacts.htm'], cb);
    else if (modName == 'tasks') require(['../modules/tasks/tasks', 'html!../modules/tasks/tasks.htm'], cb);
    else onErr();
}

哪项工作很棒.我看到 1.1-bundle.js 和 2.2-bundle.js 被添加到我的构建文件夹中.

Which work great. I'm seeing 1.1-bundle.js and 2.2-bundle.js getting added to my build folder.

问题是，当触发这些动态要求时，我在网络选项卡中看到404，因为webpack试图从我的项目的根目录而不是build文件夹中加载1-1.bundle.js.我告诉webpack放它.

The problem is, when these dynamic requires are triggered, I'm seeing 404s in my network tab, since webpack is trying to load 1-1.bundle.js from the root of my project, instead of the build folder where I told webpack to put it.

我该如何纠正?

推荐答案

您可能需要设置

You probably need to set the public path- basically, you tell webpack where on your webserver it will find the built files, which for you seems to the the build folder.

{
    output: {
        path: path.resolve(__dirname, 'build'),
        filename: '[name]-bundle.js',
        publicPath: '/build/',
    },
}

这篇关于Webpack-动态需求和路径的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！