webpack-memory2fs-plugin
Plugin that write memory files to harddist that generated by webpack when webpack-dev-server as backend
Install
npm install webpack-memory2fs-plugin -D
yarn add webpack-memory2fs-plugin -D
This is a webpack plugin that write memory file to harddist that generate by webpack, This is useful when we use webpack-dev-server proxy to backend service
Usage
webpack.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin')
const Memory2fs = require('webpack-memory2fs-plugin')
module.exports = {
entry: 'index.js',
output: {
path: __dirname + '/dist',
filename: 'index_bundle.js'
},
plugins: [
new HtmlWebpackPlugin(),
new Memory2fs()
]
}
webpack.devserver.config.js
const webpack = require('webpack')
const devServer = require('webpack-dev-server')
const wpConfigs = require('./webpack.config')
const compiler = webpack(wpConfigs)
devServer(compiler, function(){
...options
port: 8300,
proxy: {
'*': {
target: 'http://localhost:3000',
...
}
},
})
This will generate files dist/index_bundle.js, dist/index.html
nodejs with koa
var koa = require('koa')
var views = require('koa-views');
var app = new koa()
// Must be used before any router is used
app.use(views(__dirname + '/dist', {
map: {
html: 'underscore'
}
}));
Options
mapfile
Create mapfile.json
to outputPath, all of file that Generated by webpack are recorded in this file
const Memory2fs = require('webpack-memory2fs-plugin')
module.exports = {
...options
plugins: [
new Memory2fs({
mapfile: {
js: ['.js', '.jsx'],
css: ['.css'],
html: ['.html']
}
})
]
}
exclude
Allows you to skip some file to write
{Array.} string is extname about file, like ['.html', '.js']
{RegExp}
const Memory2fs = require('webpack-memory2fs-plugin')
module.exports = {
...options
plugins: [
new Memory2fs({
exclude: ['.html', '.svg'] // or exclude: /html/
})
]
}
outputPath
Allows you to specified the output root directory
const Memory2fs = require('webpack-memory2fs-plugin')
module.exports = {
...options
plugins: [
new Memory2fs({
outputPath: path.join(__dirname, 'dest')
})
]
}
extractTo
Allows you to extract files to specified directory that based on extension
The directory will be aoto created that it is a relative path offset your outputPath
or webpack outputPath
const Memory2fs = require('webpack-memory2fs-plugin')
module.exports = {
...options
plugins: [
new Memory2fs({
extractTo: {
"html": ['.html', '.hbs'],
"../myimages": ['.jpg', '.svg']
}
})
]
}