160 lines
4.1 KiB
JavaScript
160 lines
4.1 KiB
JavaScript
const _ = require('lodash');
|
|
const gulp = require('gulp');
|
|
const simpleVars = require('postcss-simple-vars');
|
|
const nested = require('postcss-nested');
|
|
const autoprefixer = require('autoprefixer');
|
|
const webpackStream = require('webpack-stream');
|
|
const livereload = require('gulp-livereload');
|
|
const path = require('path');
|
|
const webpack = require('webpack');
|
|
const errorHandler = require('./helpers/errorHandler');
|
|
const reload = require('require-nocache')(module);
|
|
const ExtractTextPlugin = require('extract-text-webpack-plugin');
|
|
|
|
const uiFolder = 'UI';
|
|
const root = path.join(__dirname, '..', 'src');
|
|
const isProduction = process.argv.indexOf('--production') > -1;
|
|
|
|
console.log('ROOT:', root);
|
|
console.log('isProduction:', isProduction);
|
|
|
|
const cssVariables = [
|
|
'../src/Styles/Variables/colors',
|
|
'../src/Styles/Variables/dimensions',
|
|
'../src/Styles/Variables/fonts',
|
|
'../src/Styles/Variables/animations'
|
|
].map(require.resolve);
|
|
|
|
const config = {
|
|
devtool: '#source-map',
|
|
stats: {
|
|
children: false
|
|
},
|
|
watchOptions: {
|
|
ignored: /node_modules/
|
|
},
|
|
entry: {
|
|
preload: 'preload.js',
|
|
vendor: 'vendor.js',
|
|
index: 'index.js'
|
|
},
|
|
resolve: {
|
|
root: [
|
|
root,
|
|
path.join(root, 'Shims'),
|
|
path.join(root, 'JsLibraries')
|
|
]
|
|
},
|
|
output: {
|
|
filename: path.join('_output', uiFolder, '[name].js'),
|
|
sourceMapFilename: path.join('_output', uiFolder, '[file].map')
|
|
},
|
|
plugins: [
|
|
new ExtractTextPlugin(path.join('_output', uiFolder, 'Content', 'styles.css'), { allChunks: true }),
|
|
new webpack.optimize.CommonsChunkPlugin({
|
|
name: 'vendor'
|
|
}),
|
|
new webpack.DefinePlugin({
|
|
__DEV__: !isProduction,
|
|
'process.env': {
|
|
NODE_ENV: isProduction ? JSON.stringify('production') : JSON.stringify('development')
|
|
}
|
|
})
|
|
],
|
|
resolveLoader: {
|
|
modulesDirectories: [
|
|
'node_modules',
|
|
'gulp/webpack/'
|
|
]
|
|
},
|
|
eslint: {
|
|
formatter: function(results) {
|
|
return JSON.stringify(results);
|
|
}
|
|
},
|
|
module: {
|
|
loaders: [
|
|
{
|
|
test: /\.js?$/,
|
|
exclude: /(node_modules|JsLibraries)/,
|
|
loader: 'babel',
|
|
query: {
|
|
plugins: ['transform-class-properties'],
|
|
presets: ['es2015', 'decorators-legacy', 'react', 'stage-2'],
|
|
env: {
|
|
development: {
|
|
plugins: ['transform-react-jsx-source']
|
|
}
|
|
}
|
|
}
|
|
},
|
|
|
|
// CSS Modules
|
|
{
|
|
test: /\.css$/,
|
|
exclude: /(node_modules|globals.css)/,
|
|
loader: ExtractTextPlugin.extract('style', 'css-loader?modules&importLoaders=1&sourceMap&localIdentName=[name]__[local]___[hash:base64:5]!postcss-loader')
|
|
},
|
|
|
|
// Global styles
|
|
{
|
|
test: /\.css$/,
|
|
include: /(node_modules|globals.css)/,
|
|
loader: 'style!css-loader'
|
|
},
|
|
|
|
// Fonts
|
|
{
|
|
test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
|
|
loader: 'url?limit=10240&mimetype=application/font-woff&emitFile=false&name=Content/Fonts/[name].[ext]'
|
|
},
|
|
{
|
|
test: /\.(ttf|eot|eot?#iefix|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
|
|
loader: 'file-loader?emitFile=false&name=Content/Fonts/[name].[ext]'
|
|
}
|
|
]
|
|
},
|
|
postcss: function(wpack) {
|
|
cssVariables.forEach(wpack.addDependency);
|
|
|
|
return [
|
|
simpleVars({
|
|
variables: function() {
|
|
return cssVariables.reduce(function(obj, vars) {
|
|
return _.extend(obj, reload(vars));
|
|
}, {});
|
|
}
|
|
}),
|
|
nested(),
|
|
autoprefixer({
|
|
browsers: [
|
|
'Chrome >= 30',
|
|
'Firefox >= 30',
|
|
'Safari >= 6',
|
|
'Edge >= 12',
|
|
'Explorer >= 10',
|
|
'iOS >= 7',
|
|
'Android >= 4.4'
|
|
]
|
|
})
|
|
];
|
|
}
|
|
};
|
|
|
|
gulp.task('webpack', () => {
|
|
return gulp.src('index.js')
|
|
.pipe(webpackStream(config))
|
|
.pipe(gulp.dest(''));
|
|
});
|
|
|
|
gulp.task('webpackWatch', () => {
|
|
config.watch = true;
|
|
return gulp.src('')
|
|
.pipe(webpackStream(config))
|
|
.on('error', errorHandler)
|
|
.pipe(gulp.dest(''))
|
|
.on('error', errorHandler)
|
|
.pipe(livereload())
|
|
.on('error', errorHandler);
|
|
});
|