https://github.com/kossnocorp/static-file-loader
file-loader that stores a map of original file names to file names with hashes in the compilation stats
https://github.com/kossnocorp/static-file-loader
Last synced: 15 days ago
JSON representation
file-loader that stores a map of original file names to file names with hashes in the compilation stats
- Host: GitHub
- URL: https://github.com/kossnocorp/static-file-loader
- Owner: kossnocorp
- Created: 2015-10-25T08:49:48.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2018-10-03T23:13:21.000Z (over 6 years ago)
- Last Synced: 2024-05-22T02:02:44.348Z (11 months ago)
- Language: JavaScript
- Homepage:
- Size: 20.5 KB
- Stars: 4
- Watchers: 5
- Forks: 6
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# static-file-loader
[](https://travis-ci.org/kossnocorp/static-file-loader)
Drop-in replacement for [file-loader](https://github.com/webpack/file-loader)
with the only difference: static-file-loader stores a map of original file names to
file names with hashes in the compilation stats:
``` json
{
"/Users/koss/src/kossnocorp/static-file-loader/test/fixtures/static/a.gif": "/980d0a50ac153b475e9fb1b8ffe22619.gif",
"/Users/koss/src/kossnocorp/static-file-loader/test/fixtures/static/b.gif": "/980d0a50ac153b475e9fb1b8ffe22619.gif",
"/Users/koss/src/kossnocorp/static-file-loader/test/fixtures/static/c.gif": "/980d0a50ac153b475e9fb1b8ffe22619.gif"
}
```
It's helpful if you want to use webpack to pre-build static files and then
build HTML template using the paths map.
## Installation
```
npm install static-file-loader file-loader --save-dev
```
## Example
In an entry:
``` js
require.context('!!static-file-loader!./static', true, /.+/)
// ...
```
Template:
``` erb
' />
```
Development server:
``` js
// ...
var staticFilesPath = path.join(process.cwd(), 'static')
var publicPath = webpackConfig.output.publicPath
express()
.use('/', express.static(staticFilesPath))
.get('*', function(req, res) {
var html = template({
staticPath: function(staticFilePath) {
return path.join(publicPath, staticFilePath)
}
})
res.send(html)
})
```
Production build script:
``` js
// ...
var staticMapKey = require('static-file-loader').key
var staticFilesPath = path.join(process.cwd(), 'assets')
var publicPath = webpackConfig.output.publicPath
webpack(webpackConfig).run(function(err, stats) {
var staticMap = stats.compilation[staticMapKey]
var html = template({
staticPath: function(staticFilePath) {
var processedStaticFilePath = staticMap[path.join(staticFilesPath, staticFilePath)]
return path.join(publicPath, processedStaticFilePath)
}
})
// ...
})
```
## License
MIT