webpack.config.babel.js 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  1. import webpack from 'webpack';
  2. import path from 'path';
  3. const pckg = require('./package.json');
  4. const time = new Date();
  5. const bannerPlugin = new webpack.BannerPlugin(
  6. `${pckg.name} ${pckg.version} (${time})
  7. ${pckg.homepage}
  8. @license ${pckg.license}`
  9. );
  10. // from http://stackoverflow.com/a/34749873
  11. /**
  12. * Simple is object check.
  13. * @param item
  14. * @returns {boolean}
  15. */
  16. export function isObject(item) {
  17. return (item && typeof item === 'object' && !Array.isArray(item));
  18. }
  19. /**
  20. * Deep merge two objects.
  21. * @param target
  22. * @param source
  23. */
  24. export function mergeDeep(target, source) {
  25. if (isObject(target) && isObject(source)) {
  26. for (const key in source) {
  27. if (isObject(source[key])) {
  28. if (!target[key]) Object.assign(target, { [key]: {} });
  29. mergeDeep(target[key], source[key]);
  30. } else {
  31. Object.assign(target, { [key]: source[key] });
  32. }
  33. }
  34. }
  35. return target;
  36. }
  37. const config = {
  38. context: __dirname,
  39. devtool: 'source-map',
  40. entry: {
  41. wavesurfer: path.resolve(__dirname, 'src', 'wavesurfer.js')
  42. },
  43. output: {
  44. path: path.resolve(__dirname, 'dist'),
  45. publicPath: 'localhost:8080/dist/',
  46. filename: '[name].js',
  47. library: 'WaveSurfer',
  48. libraryTarget: 'umd',
  49. umdNamedDefine: true
  50. },
  51. devServer: {
  52. contentBase: [
  53. path.join(__dirname)
  54. ],
  55. publicPath: 'localhost:8080/dist/',
  56. watchContentBase: true
  57. },
  58. performance: {
  59. hints: false
  60. },
  61. module: {
  62. rules: [
  63. {
  64. test: /\.js$/,
  65. enforce: 'pre',
  66. exclude: /node_modules/,
  67. use: [{
  68. loader: 'eslint-loader'
  69. }]
  70. }, {
  71. test: /\.js$/,
  72. exclude: /node_modules/,
  73. use: [{
  74. loader: 'babel-loader',
  75. options: {
  76. plugins: ["transform-class-properties", "add-module-exports"],
  77. presets: [
  78. ['es2015', { modules: false }],
  79. 'stage-0'
  80. ]
  81. }
  82. }]
  83. }
  84. ]
  85. },
  86. plugins: [
  87. bannerPlugin
  88. ],
  89. };
  90. /**
  91. * buildPluginEntry - Description
  92. *
  93. * @param {Array} plugins Name of plugins in src/plugin
  94. *
  95. * @returns {object} Entry object { name: nameUrl }
  96. */
  97. function buildPluginEntry(plugins) {
  98. const result = {};
  99. plugins.forEach(plugin => result[plugin] = path.resolve(__dirname, 'src', 'plugin', plugin));
  100. return result;
  101. }
  102. export default function (options) {
  103. if (options) {
  104. if (options.test) {
  105. mergeDeep(config, {
  106. devtool: 'source-map',
  107. // @TODO: Remove this and allow normal linting for tests and fix
  108. // the linting issues. (test files should have the same rules
  109. // property as the rest of the code)
  110. module: {
  111. rules: [
  112. {
  113. test: /\.js$/,
  114. exclude: /node_modules/,
  115. use: [{
  116. loader: 'babel-loader',
  117. options: {
  118. plugins: ["transform-class-properties", "add-module-exports"],
  119. presets: [
  120. ['es2015', { modules: false }],
  121. 'stage-0'
  122. ]
  123. }
  124. }]
  125. }
  126. ]
  127. }
  128. })
  129. }
  130. // html init code
  131. if (options.htmlinit) {
  132. delete config.entry;
  133. mergeDeep(config, {
  134. entry: {
  135. 'html-init': path.join(__dirname, 'src', 'html-init.js')
  136. },
  137. output: {
  138. filename: 'wavesurfer-[name].js',
  139. library: ['WaveSurfer', '[name]']
  140. }
  141. });
  142. }
  143. // plugins
  144. if (options.plugins) {
  145. delete config.entry;
  146. mergeDeep(config, {
  147. entry: buildPluginEntry([
  148. 'timeline',
  149. 'minimap',
  150. 'regions',
  151. 'spectrogram',
  152. 'cursor',
  153. 'microphone',
  154. 'elan'
  155. ]),
  156. output: {
  157. path: path.resolve(__dirname, 'dist', 'plugin'),
  158. filename: 'wavesurfer.[name].js',
  159. library: ['WaveSurfer', '[name]'],
  160. publicPath: 'localhost:8080/dist/plugin/'
  161. },
  162. devServer: {
  163. publicPath: 'localhost:8080/dist/plugin/'
  164. }
  165. });
  166. }
  167. // minified builds
  168. if (options.minify) {
  169. mergeDeep(config, {
  170. plugins: [
  171. new webpack.optimize.UglifyJsPlugin({
  172. sourceMap: true
  173. }),
  174. bannerPlugin
  175. ]
  176. });
  177. // rename outputs
  178. if (options.plugins) {
  179. mergeDeep(config, {
  180. output: {
  181. filename: 'wavesurfer.[name].min.js'
  182. }
  183. });
  184. } else if (options.htmlinit) {
  185. mergeDeep(config, {
  186. output: {
  187. filename: 'wavesurfer-[name].min.js'
  188. }
  189. });
  190. } else {
  191. mergeDeep(config, {
  192. output: {
  193. filename: '[name].min.js'
  194. }
  195. })
  196. }
  197. }
  198. }
  199. return config
  200. }