README
atorable-loader
©
Why? Decreased data from your server.
The atorable-loader
resolves import
/require()
of a file into a Webtorrent magnet uri.
During the webpack build the target file is emitted along with the corresponding torrent file into the output directory. The emitted files act as the seeds for the torrent when the root url is provided to the build. This works closely with atorable-react.
Demo
Getting Started
To begin, you'll need to install atorable-loader
:
$ npm install atorable-loader --save-dev
Import (or require
) the target file(s) in one of the bundle's files (see atorable-react):
file.tsx
import React, { Component } from 'react'
import { VidStrmATor, ImgATor, VidATor } from 'atorable-react'
import hugeImage from './hugeImage.jpg' // ==> 'magnet:?xt=urn:...'
import bestMovieEverTribute from './bestMovieEverTribute.mp4' // ==> 'magnet:?xt=urn:...'
const oceanFish = require('./oceanFish.m4v') // ==> {default: 'magnet:?xt=urn:...'}
class Example extends Component {
render() {
return (
<div>
<VidATor
width='320'
height='240'
type={'m4v'}
magnetLink={oceanFish}
/>
<VidStrmATor
width='320'
height='240'
type={'mp4'}
autoplay={true}
magnetLink={bestMovieEverTribute}
/>
<ImgATor magnetLink={hugeImage} style={{ border: 'solid' }} />
</div>
)
}
}
Then add the loader to your webpack
config. For example:
webpack.config.js
const rootURL = 'http://localhost:8080/' // Define your root url http://example.com/
// this makes it possible for the initial torrent to be downloaded.
module.exports = {
module: {
rules: [
{
test: /\.(png|jpe?g|gif|svg|m4v|mp4)$/i,
use: [
{
loader: 'atorable-loader',
options: {
baseURL: rootURL
}
}
]
}
]
}
}
And run webpack
via your preferred method. This will emit file.png
and a file.torrent
file
in the output directory.
Options
Function
For use with a set build environment NODE_ENV=development
(not relevant to webpack env settings i.e. EnvironmentPlugin)
webpack.config.js
const devURL = 'http://localhost:8080/' // Define your root url
const prodURL = 'http://www.example.com/'
module.exports = {
module: {
rules: [
{
test: /\.(png|jpe?g|gif)$/i,
use: [
{
loader: 'atorable-loader',
options: {
rootUrl() {
console.log(
'Here Node env: ',
process.env.NODE_ENV
)
if (process.env.NODE_ENV === 'development') {
return devURL
}
return prodURL
}
}
}
]
}
]
}
}
Target
Array
webpack.config.js
const rootURL = 'http://localhost:8080/' // Define your root url http://example.com/
module.exports = {
module: {
rules: [
{
test: /\.(png|jpe?g|gif)$/i,
use: [
{
loader: 'atorable-loader',
options: {
baseURL: rootURL
}
}
],
include: [path.resolve(__dirname, 'img')],
exclude: [
path.resolve(__dirname, 'app/demo-files'),
/node_modules/,
/doNotWant\.jpg$/
]
}
]
}
}