2017-07-14 11:29:12 -04:00
|
|
|
const defaultsDeep = require('lodash.defaultsdeep');
|
|
|
|
const path = require('path');
|
2017-07-13 14:03:48 -04:00
|
|
|
|
|
|
|
// Plugins
|
2017-07-27 16:51:42 -04:00
|
|
|
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
2018-05-07 14:21:22 -04:00
|
|
|
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
|
2017-07-13 14:03:48 -04:00
|
|
|
|
|
|
|
// PostCss
|
2017-07-27 16:51:42 -04:00
|
|
|
const autoprefixer = require('autoprefixer');
|
|
|
|
const postcssVars = require('postcss-simple-vars');
|
|
|
|
const postcssImport = require('postcss-import');
|
2017-07-13 14:03:48 -04:00
|
|
|
|
2017-07-14 11:29:12 -04:00
|
|
|
const base = {
|
2018-05-07 14:21:22 -04:00
|
|
|
mode: process.env.NODE_ENV === 'production' ? 'production' : 'development',
|
2017-07-13 14:03:48 -04:00
|
|
|
devtool: 'cheap-module-source-map',
|
|
|
|
module: {
|
|
|
|
rules: [{
|
|
|
|
test: /\.jsx?$/,
|
|
|
|
loader: 'babel-loader',
|
|
|
|
include: path.resolve(__dirname, 'src'),
|
|
|
|
options: {
|
|
|
|
plugins: ['transform-object-rest-spread'],
|
|
|
|
presets: ['es2015', 'react']
|
|
|
|
}
|
|
|
|
},
|
|
|
|
{
|
|
|
|
test: /\.css$/,
|
|
|
|
use: [{
|
|
|
|
loader: 'style-loader'
|
|
|
|
}, {
|
|
|
|
loader: 'css-loader',
|
|
|
|
options: {
|
|
|
|
modules: true,
|
|
|
|
importLoaders: 1,
|
|
|
|
localIdentName: '[name]_[local]_[hash:base64:5]',
|
|
|
|
camelCase: true
|
|
|
|
}
|
|
|
|
}, {
|
|
|
|
loader: 'postcss-loader',
|
|
|
|
options: {
|
|
|
|
ident: 'postcss',
|
|
|
|
plugins: function () {
|
|
|
|
return [
|
|
|
|
postcssImport,
|
|
|
|
postcssVars,
|
|
|
|
autoprefixer({
|
|
|
|
browsers: ['last 3 versions', 'Safari >= 8', 'iOS >= 8']
|
|
|
|
})
|
|
|
|
];
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}]
|
2017-10-19 15:08:15 -04:00
|
|
|
},
|
2017-10-25 14:47:24 -04:00
|
|
|
{
|
|
|
|
test: /\.png$/i,
|
|
|
|
loader: 'url-loader'
|
|
|
|
},
|
2017-10-19 15:08:15 -04:00
|
|
|
{
|
|
|
|
test: /\.svg$/,
|
|
|
|
loader: 'svg-url-loader?noquotes'
|
2017-07-13 14:03:48 -04:00
|
|
|
}]
|
|
|
|
},
|
2018-05-07 14:21:22 -04:00
|
|
|
optimization: {
|
|
|
|
minimizer: [
|
|
|
|
new UglifyJsPlugin({
|
|
|
|
include: /\.min\.js$/
|
2017-08-29 17:24:40 -04:00
|
|
|
})
|
2018-05-07 14:21:22 -04:00
|
|
|
]
|
|
|
|
},
|
|
|
|
plugins: []
|
2017-07-13 14:03:48 -04:00
|
|
|
};
|
2017-07-14 11:29:12 -04:00
|
|
|
|
|
|
|
module.exports = [
|
|
|
|
// For the playground
|
|
|
|
defaultsDeep({}, base, {
|
|
|
|
devServer: {
|
|
|
|
contentBase: path.resolve(__dirname, 'playground'),
|
|
|
|
host: '0.0.0.0',
|
|
|
|
port: process.env.PORT || 8078
|
|
|
|
},
|
|
|
|
entry: {
|
|
|
|
playground: './src/playground/playground.jsx'
|
|
|
|
},
|
|
|
|
output: {
|
|
|
|
path: path.resolve(__dirname, 'playground'),
|
|
|
|
filename: '[name].js'
|
|
|
|
},
|
|
|
|
plugins: base.plugins.concat([
|
|
|
|
new HtmlWebpackPlugin({
|
|
|
|
template: 'src/playground/index.ejs',
|
|
|
|
title: 'Scratch 3.0 Paint Editor Playground'
|
|
|
|
})
|
|
|
|
])
|
|
|
|
}),
|
|
|
|
// For use as a library
|
|
|
|
defaultsDeep({}, base, {
|
2017-08-28 18:01:18 -04:00
|
|
|
externals: {
|
|
|
|
'react': 'react',
|
|
|
|
'react-dom': 'react-dom',
|
|
|
|
'minilog': 'minilog'
|
|
|
|
},
|
2017-07-14 11:29:12 -04:00
|
|
|
entry: {
|
|
|
|
'scratch-paint': './src/index.js'
|
|
|
|
},
|
|
|
|
output: {
|
|
|
|
path: path.resolve(__dirname, 'dist'),
|
2017-08-28 18:01:18 -04:00
|
|
|
filename: '[name].js',
|
2017-08-29 17:24:40 -04:00
|
|
|
libraryTarget: 'commonjs2'
|
2017-07-14 11:29:12 -04:00
|
|
|
}
|
|
|
|
})
|
|
|
|
];
|