CODEWITHSUNDEEP
webpackwebpack-dev-server
Jon Harding
Jon Harding

Reputation: 4946

Serve Webpack from a virtual directory

I am building all my files int a 'dist' folder.

Dist

->index.html

->bundle.js

I have the configuration set to run off a specific port that I need.

{   
    entry: './src/index.js',
    devtool: 'source-map',
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'dist')
    },
    devServer: {
        port: 9004,
        contentBase: path.join(__dirname, "dist")
    },
    watch: true,
}

I've tried adding 

proxy: {
    "/virtual-directory-name-here": {
        "target": {
            "host": "localhost",
            "port": 9004
        }
    }
}

Under devServer, but with no luck. I understand you can add publicPath under output, but I don't necessarily need the files served with the virtual directory in it. I just want it to act like an IIS virtual directory.

My ultimate goal is to serve all files from the dist folder at http://localhost:9004/virtual-directory-name-here

Can someone point me in the right direction?

Upvotes: 3

Views: 1493

Answers (2)

ezekiel87
ezekiel87

Reputation: 61

I've been searching for this, too. Found a solution using the proxy option for devServer:

proxy: {
    "/virtual-folder": {
        target: "http://127.0.0.1:9004",
        pathRewrite: {"^/virtual-folder" : ""},
    }
},

Also, if someone uses https for localhost, may need to add to the config: 

secure: false

Upvotes: 1

AJ Richardson
AJ Richardson

Reputation: 6830

I was able to do it with this configuration:

export = {
    devServer: {
        publicPath: "/virtual-directory-name-here/",
        openPage: "virtual-directory-name-here/",
    },
};

Note that publicPath has a preceding slash but openPage does not. This seems to be important.

Upvotes: 0

Related Questions