2

3

// -------------------------------------------------------------------------------

3

// -------------------------------------------------------------------------------

4

// Config

4

// Config

5

6

const env = require('gulp-environment')

6

const env = require('gulp-environment')

7

8

process.env.NODE_ENV = env.current.name

8

process.env.NODE_ENV = env.current.name

9

10

const conf = (() => {

10

const conf = (() => {

11

const _conf = require('./build-config')

11

const _conf = require('./build-config')

12

return require('deepmerge').all([{}, _conf.base || {}, _conf[process.env.NODE_ENV] || {}])

12

return require('deepmerge').all([{}, _conf.base || {}, _conf[process.env.NODE_ENV] || {}])

13

})()

13

})()

14

15

conf.buildPath = path.resolve(__dirname, conf.buildPath).replace(/\\/g, '/')

15

conf.buildPath = path.resolve(__dirname, conf.buildPath).replace(/\\/g, '/')

16

17

// -------------------------------------------------------------------------------

17

// -------------------------------------------------------------------------------

18

// Modules

18

// Modules

19

20

const { src, dest, parallel, series, watch } = require('gulp')

20

const { src, dest, parallel, series, watch } = require('gulp')

21

const webpack = require('webpack')

21

const webpack = require('webpack')

22

const sass = require('gulp-sass')

22

const sass = require('gulp-sass')

23

const autoprefixer = require('gulp-autoprefixer')

23

const autoprefixer = require('gulp-autoprefixer')

24

const rename = require('gulp-rename')

24

const rename = require('gulp-rename')

25

const gulpIf = require('gulp-if')

25

const gulpIf = require('gulp-if')

26

const sourcemaps = require('gulp-sourcemaps')

26

const sourcemaps = require('gulp-sourcemaps')

27

const del = require('del')

27

const del = require('del')

28

const colors = require('ansi-colors')

28

const colors = require('ansi-colors')

29

const log = require('fancy-log')

29

const log = require('fancy-log')

32

33

// -------------------------------------------------------------------------------

34

// -------------------------------------------------------------------------------

34

// Utilities

35

// Utilities

35

36

function normalize(p) {

37

function normalize(p) {

37

return p.replace(/\\/g, '/')

38

return p.replace(/\\/g, '/')

38

}

39

}

39

40

function root(p) {

41

function root(p) {

41

return p.startsWith('!') ?

42

return p.startsWith('!') ?

42

normalize(`!${path.join(__dirname, p.slice(1))}`) :

43

normalize(`!${path.join(__dirname, p.slice(1))}`) :

43

normalize(path.join(__dirname, p))

44

normalize(path.join(__dirname, p))

44

}

45

}

45

46

function getSrc(...src) {

47

function getSrc(...src) {

47

return src.map(p => root(p)).concat(conf.exclude.map(d => `!${root(d)}/**/*`))

48

return src.map(p => root(p)).concat(conf.exclude.map(d => `!${root(d)}/**/*`))

48

}

49

}

49

50

// -------------------------------------------------------------------------------

51

// -------------------------------------------------------------------------------

51

// Clean build directory

52

// Clean build directory

52

53

const cleanTask = function () {

54

const cleanTask = function () {

54

return del([

55

return del([

55

`${conf.buildPath}/**/*.dist.js`,

56

`${conf.buildPath}/**/*.dist.js`,

56

`${conf.buildPath}/**/*.dist.css`,

57

`${conf.buildPath}/**/*.dist.css`,

57

`!${conf.buildPath}/Vendor/fonts/*.dist.css`,

58

`!${conf.buildPath}/Vendor/fonts/*.dist.css`,

58

...conf.exclude.map(p => `!${conf.buildPath}/${p}/**/*`)

59

...conf.exclude.map(p => `!${conf.buildPath}/${p}/**/*`)

59

], {

60

], {

60

force: true

61

force: true

61

})

62

})

62

}

63

}

63

64

const cleanSourcemapsTask = function () {

65

const cleanSourcemapsTask = function () {

65

return del([

66

return del([

66

`${conf.buildPath}/**/*.map`,

67

`${conf.buildPath}/**/*.map`,

67

...conf.exclude.map(p => `!${conf.buildPath}/${p}/**/*`)

68

...conf.exclude.map(p => `!${conf.buildPath}/${p}/**/*`)

68

], {

69

], {

69

force: true

70

force: true

70

})

71

})

71

}

72

}

72

73

const cleanAllTask = parallel(cleanTask, cleanSourcemapsTask)

74

const cleanAllTask = parallel(cleanTask, cleanSourcemapsTask)

74

75

// -------------------------------------------------------------------------------

76

// -------------------------------------------------------------------------------

76

// Build css

77

// Build css

77

78

const buildCssTask = function () {

79

const buildCssTask = function () {

79

return src(getSrc('**/*.scss', '!**/_*.scss'), { base: root('.') })

80

return src(getSrc('**/*.scss', '!**/_*.scss'), { base: root('.') })

80

81

.pipe(gulpIf(conf.sourcemaps, sourcemaps.init()))

82

.pipe(gulpIf(conf.sourcemaps, sourcemaps.init()))

82

.pipe(sass({

83

.pipe(sass({

83

outputStyle: conf.minify ? 'compressed' : 'nested'

84

outputStyle: conf.minify ? 'compressed' : 'nested'

84

}).on('error', sass.logError))

85

}).on('error', sass.logError))

85

.pipe(gulpIf(conf.sourcemaps, sourcemaps.write()))

86

.pipe(gulpIf(conf.sourcemaps, sourcemaps.write()))

86

87

.pipe(gulpIf(conf.sourcemaps, sourcemaps.init({

88

.pipe(gulpIf(conf.sourcemaps, sourcemaps.init({

88

loadMaps: true

89

loadMaps: true

89

})))

90

})))

90

.pipe(autoprefixer({

91

.pipe(autoprefixer({

91

overrideBrowserslist: [

92

overrideBrowserslist: [

92

'>= 1%',

93

'>= 1%',

93

'last 2 versions',

94

'last 2 versions',

94

'not dead',

95

'not dead',

95

'Chrome >= 45',

96

'Chrome >= 45',

96

'Firefox >= 38',

97

'Firefox >= 38',

97

'Edge >= 12',

98

'Edge >= 12',

98

'Explorer >= 10',

99

'Explorer >= 10',

99

'iOS >= 9',

100

'iOS >= 9',

100

'Safari >= 9',

101

'Safari >= 9',

101

'Android >= 4.4',

102

'Android >= 4.4',

102

'Opera >= 30'

103

'Opera >= 30'

103

]

104

]

104

}))

105

}))

105

.pipe(rename({ extname: '.dist.css' }))

106

.pipe(rename({ extname: '.dist.css' }))

106

.pipe(gulpIf(conf.sourcemaps, sourcemaps.write()))

107

.pipe(gulpIf(conf.sourcemaps, sourcemaps.write()))

107

108

.pipe(dest(conf.buildPath))

109

.pipe(dest(conf.buildPath))

109

}

110

}

110

111

// -------------------------------------------------------------------------------

112

// -------------------------------------------------------------------------------

112

// Build js

113

// Build js

113

114

const buildJsTask = function (cb) {

115

const buildJsTask = function (cb) {

115

setTimeout(function () {

116

setTimeout(function () {

116

webpack(require('./webpack.config'), (err, stats) => {

117

webpack(require('./webpack.config'), (err, stats) => {

117

if (err) {

118

if (err) {

118

log(colors.gray('Webpack error:'), colors.red(err.stack || err))

119

log(colors.gray('Webpack error:'), colors.red(err.stack || err))

119

if (err.details) log(colors.gray('Webpack error details:'), err.details)

120

if (err.details) log(colors.gray('Webpack error details:'), err.details)

120

return cb()

121

return cb()

121

}

122

}

122

123

const info = stats.toJson()

124

const info = stats.toJson()

124

125

if (stats.hasErrors()) {

126

if (stats.hasErrors()) {

126

info.errors.forEach(e => log(colors.gray('Webpack compilation error:'), colors.red(e)))

127

info.errors.forEach(e => log(colors.gray('Webpack compilation error:'), colors.red(e)))

127

}

128

}

128

129

if (stats.hasWarnings()) {

130

if (stats.hasWarnings()) {

130

info.warnings.forEach(w => log(colors.gray('Webpack compilation warning:'), colors.yellow(w)))

131

info.warnings.forEach(w => log(colors.gray('Webpack compilation warning:'), colors.yellow(w)))

131

}

132

}

132

133

// Print log

134

// Print log

134

log(stats.toString({

135

log(stats.toString({

135

colors: colors.enabled,

136

colors: colors.enabled,

136

hash: false,

137

hash: false,

137

timings: false,

138

timings: false,

138

chunks: false,

139

chunks: false,

139

chunkModules: false,

140

chunkModules: false,

140

modules: false,

141

modules: false,

141

children: true,

142

children: true,

142

version: true,

143

version: true,

143

cached: false,

144

cached: false,

144

cachedAssets: false,

145

cachedAssets: false,

145

reasons: false,

146

reasons: false,

146

source: false,

147

source: false,

147

errorDetails: false

148

errorDetails: false

148

}))

149

}))

149

150

cb()

151

cb()

151

})

152

})

152

}, 1)

153

}, 1)

153

}

154

}

154

155

// -------------------------------------------------------------------------------

156

// -------------------------------------------------------------------------------

156

// Watch

157

// Watch

157

158

const watchTask = function () {

159

const watchTask = function () {

159

watch(getSrc('**/*.scss'), buildCssTask)

160

watch(getSrc('**/*.scss'), buildCssTask)

160

watch(getSrc('**/*.js', '!**/*.dist.js'), buildJsTask)

161

watch(getSrc('**/*.js', '!**/*.dist.js'), buildJsTask)

161

}

162

}

162

163

// -------------------------------------------------------------------------------

164

// -------------------------------------------------------------------------------

164

// Build

165

// Build

165

166

const buildTasks = [

167

const buildTasks = [

167

buildCssTask,

168

buildCssTask,

168

buildJsTask

169

buildJsTask

169

]

170

]

170

171

const buildTask = conf.cleanBuild ?

172

const buildTask = conf.cleanBuild ?

172

series(cleanAllTask, parallel(buildTasks)):

173

series(cleanAllTask, parallel(buildTasks)):

173

series(cleanSourcemapsTask, parallel(buildTasks))

174

series(cleanSourcemapsTask, parallel(buildTasks))

174

175

// -------------------------------------------------------------------------------

176

// -------------------------------------------------------------------------------

176

// Exports

177

// Exports

177

178

module.exports = {

179

module.exports = {

179

default: buildTask,

180

default: buildTask,

180

clean: cleanAllTask,

181

clean: cleanAllTask,

181

build: buildTask,

182

build: buildTask,

182

'build:js': buildJsTask,

183

'build:js': buildJsTask,

183

'build:css': buildCssTask,

184

'build:css': buildCssTask,

184

watch: watchTask

185

watch: watchTask

 const path = require('path')
 // -------------------------------------------------------------------------------
 // Config
 const env = require('gulp-environment')
 process.env.NODE_ENV = env.current.name
 const conf = (() => {
   const _conf = require('./build-config')
   return require('deepmerge').all([{}, _conf.base || {}, _conf[process.env.NODE_ENV] || {}])
 })()
 conf.buildPath = path.resolve(__dirname, conf.buildPath).replace(/\\/g, '/')
 // -------------------------------------------------------------------------------
 // Modules
 const { src, dest, parallel, series, watch } = require('gulp')
 const webpack = require('webpack')
 const sass = require('gulp-sass')
 const autoprefixer = require('gulp-autoprefixer')
 const rename = require('gulp-rename')
 const gulpIf = require('gulp-if')
 const sourcemaps = require('gulp-sourcemaps')
 const del = require('del')
 const colors = require('ansi-colors')
 const log = require('fancy-log')
+sass.compiler = require('node-sass')
 colors.enabled = require('color-support').hasBasic
 // -------------------------------------------------------------------------------
 // Utilities
 function normalize(p) {
   return p.replace(/\\/g, '/')
 }
 function root(p) {
   return p.startsWith('!') ?
     normalize(`!${path.join(__dirname, p.slice(1))}`) :
     normalize(path.join(__dirname, p))
 }
 function getSrc(...src) {
   return src.map(p => root(p)).concat(conf.exclude.map(d => `!${root(d)}/**/*`))
 }
 // -------------------------------------------------------------------------------
 // Clean build directory
 const cleanTask = function () {
   return del([
     `${conf.buildPath}/**/*.dist.js`,
     `${conf.buildPath}/**/*.dist.css`,
     `!${conf.buildPath}/Vendor/fonts/*.dist.css`,
     ...conf.exclude.map(p => `!${conf.buildPath}/${p}/**/*`)
   ], {
     force: true
   })
 }
 const cleanSourcemapsTask = function () {
   return del([
     `${conf.buildPath}/**/*.map`,
     ...conf.exclude.map(p => `!${conf.buildPath}/${p}/**/*`)
   ], {
     force: true
   })
 }
 const cleanAllTask = parallel(cleanTask, cleanSourcemapsTask)
 // -------------------------------------------------------------------------------
 // Build css
 const buildCssTask = function () {
   return src(getSrc('**/*.scss', '!**/_*.scss'), { base: root('.') })
     .pipe(gulpIf(conf.sourcemaps, sourcemaps.init()))
     .pipe(sass({
       outputStyle: conf.minify ? 'compressed' : 'nested'
     }).on('error', sass.logError))
     .pipe(gulpIf(conf.sourcemaps, sourcemaps.write()))
     .pipe(gulpIf(conf.sourcemaps, sourcemaps.init({
       loadMaps: true
     })))
     .pipe(autoprefixer({
       overrideBrowserslist: [
         '>= 1%',
         'last 2 versions',
         'not dead',
         'Chrome >= 45',
         'Firefox >= 38',
         'Edge >= 12',
         'Explorer >= 10',
         'iOS >= 9',
         'Safari >= 9',
         'Android >= 4.4',
         'Opera >= 30'
       ]
     }))
     .pipe(rename({ extname: '.dist.css' }))
     .pipe(gulpIf(conf.sourcemaps, sourcemaps.write()))
     .pipe(dest(conf.buildPath))
 }
 // -------------------------------------------------------------------------------
 // Build js
 const buildJsTask = function (cb) {
   setTimeout(function () {
     webpack(require('./webpack.config'), (err, stats) => {
       if (err) {
         log(colors.gray('Webpack error:'), colors.red(err.stack || err))
         if (err.details) log(colors.gray('Webpack error details:'), err.details)
         return cb()
       }
       const info = stats.toJson()
       if (stats.hasErrors()) {
         info.errors.forEach(e => log(colors.gray('Webpack compilation error:'), colors.red(e)))
       }
       if (stats.hasWarnings()) {
         info.warnings.forEach(w => log(colors.gray('Webpack compilation warning:'), colors.yellow(w)))
       }
       // Print log
       log(stats.toString({
         colors: colors.enabled,
         hash: false,
         timings: false,
         chunks: false,
         chunkModules: false,
         modules: false,
         children: true,
         version: true,
         cached: false,
         cachedAssets: false,
         reasons: false,
         source: false,
         errorDetails: false
       }))
       cb()
     })
   }, 1)
 }
 // -------------------------------------------------------------------------------
 // Watch
 const watchTask = function () {
   watch(getSrc('**/*.scss'), buildCssTask)
   watch(getSrc('**/*.js', '!**/*.dist.js'), buildJsTask)
 }
 // -------------------------------------------------------------------------------
 // Build
 const buildTasks = [
   buildCssTask,
   buildJsTask
 ]
 const buildTask = conf.cleanBuild ?
   series(cleanAllTask, parallel(buildTasks)):
   series(cleanSourcemapsTask, parallel(buildTasks))
 // -------------------------------------------------------------------------------
 // Exports
 module.exports = {
   default: buildTask,
   clean: cleanAllTask,
   build: buildTask,
   'build:js': buildJsTask,
   'build:css': buildCssTask,
   watch: watchTask
 }