Advertisement
Guest User

build/webpack.config.js con jQuery y ProvidePlugin

a guest
Apr 23rd, 2018
80
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.85 KB | None | 0 0
  1. const path = require('path');
  2. const webpack = require('webpack');
  3. const merge = require('webpack-merge');
  4. const fs = require('fs');
  5. const HTMLWebpackPlugin = require('html-webpack-plugin');
  6. const CleanPlugin = require('clean-webpack-plugin');
  7. const CopyGlobsPlugin = require('copy-globs-webpack-plugin');
  8. const ExtractTextPlugin = require("extract-text-webpack-plugin");
  9. const FriendlyErrorsWebpackPlugin = require('friendly-errors-webpack-plugin');
  10.  
  11. const config = require('./config');
  12.  
  13. const assetsFilenames = '[name]';
  14.  
  15. const generateHtmlPlugins = (templateDir) => {
  16. const templateFiles = fs.readdirSync(path.resolve(__dirname, templateDir)).filter( item => 'html' === item.split('.')[1] );
  17. return templateFiles.map(item => {
  18. const parts = item.split('.');
  19. const name = parts[0];
  20. const extension = parts[1];
  21. return new HTMLWebpackPlugin({
  22. filename: `../${name}.html`,
  23. template: path.resolve(__dirname, `${templateDir}/${name}.${extension}`),
  24. minify: config.enabled.optimize ? { removeComments: true, collapseWhitespace: true } : false,
  25. });
  26. });
  27. };
  28.  
  29. // Call our function on our views directory.
  30. const htmlPlugins = generateHtmlPlugins(config.paths.src);
  31.  
  32. let webpackConfig = {
  33. context: config.paths.assets,
  34. entry: config.entry,
  35. devtool: (config.enabled.sourceMaps ? '#source-map' : undefined),
  36. output: {
  37. path: config.paths.dist,
  38. publicPath: config.publicPath,
  39. filename: `scripts/${assetsFilenames}.js`,
  40. },
  41. stats: {
  42. hash: false,
  43. version: false,
  44. timings: false,
  45. children: false,
  46. errors: false,
  47. errorDetails: false,
  48. warnings: true,
  49. chunks: false,
  50. modules: false,
  51. reasons: false,
  52. source: false,
  53. publicPath: false,
  54. },
  55. module: {
  56. rules: [
  57. {
  58. enforce: 'pre',
  59. test: /\.(js|s?[ca]ss)$/,
  60. include: config.paths.assets,
  61. loader: 'import-glob',
  62. },
  63. {
  64. test: /\.js$/,
  65. exclude: [/node_modules(?![/|\\](bootstrap|foundation-sites))/],
  66. use: [
  67. { loader: 'cache' },
  68. { loader: 'buble', options: { objectAssign: 'Object.assign' } },
  69. ],
  70. },
  71. {
  72. test: /\.css$/,
  73. include: config.paths.assets,
  74. use: ExtractTextPlugin.extract({
  75. fallback: 'style',
  76. use: [
  77. { loader: 'cache' },
  78. { loader: 'css', options: { sourceMap: config.enabled.sourceMaps } },
  79. {
  80. loader: 'postcss', options: {
  81. config: { path: __dirname, ctx: config },
  82. sourceMap: config.enabled.sourceMaps,
  83. },
  84. },
  85. ],
  86. }),
  87. },
  88. {
  89. test: /\.scss$/,
  90. include: config.paths.assets,
  91. use: ExtractTextPlugin.extract({
  92. fallback: 'style',
  93. use: [
  94. { loader: 'cache' },
  95. { loader: 'css', options: { sourceMap: config.enabled.sourceMaps } },
  96. {
  97. loader: 'postcss', options: {
  98. config: { path: __dirname, ctx: config },
  99. sourceMap: config.enabled.sourceMaps,
  100. },
  101. },
  102. { loader: 'resolve-url', options: { sourceMap: config.enabled.sourceMaps } },
  103. { loader: 'sass', options: { sourceMap: config.enabled.sourceMaps } },
  104. ],
  105. }),
  106. },
  107. {
  108. test: /\.(ttf|eot|woff2?|png|jpe?g|gif|svg|ico)$/,
  109. include: config.paths.assets,
  110. loader: 'url',
  111. options: {
  112. limit: 4096,
  113. publicPath: config.enabled.watcher ? 'assets/' : '../',
  114. outputPath: '',
  115. name: `[path]${assetsFilenames}.[ext]`,
  116. },
  117. },
  118. {
  119. test: /\.(ttf|eot|woff2?|png|jpe?g|gif|svg|ico)$/,
  120. include: /node_modules/,
  121. loader: 'url',
  122. options: {
  123. limit: 4096,
  124. publicPath: config.enabled.watcher ? 'assets/' : '../',
  125. outputPath: 'vendor/',
  126. context: path.join( config.paths.root, 'node_modules' ),
  127. name: `[path]${assetsFilenames}.[ext]`,
  128. },
  129. },
  130. ],
  131. },
  132. resolve: {
  133. modules: [
  134. config.paths.assets,
  135. 'node_modules',
  136. ],
  137. enforceExtension: false,
  138. },
  139. resolveLoader: {
  140. moduleExtensions: ['-loader'],
  141. },
  142. plugins: [
  143. new webpack.ProvidePlugin({
  144. $: 'jquery',
  145. jQuery: 'jquery'
  146. }),
  147. new CleanPlugin([config.paths.distHtml], {
  148. root: config.paths.root,
  149. verbose: false,
  150. }),
  151. new CopyGlobsPlugin({
  152. pattern: config.copy,
  153. output: `[path]${assetsFilenames}.[ext]`,
  154. manifest: config.manifest,
  155. }),
  156. new ExtractTextPlugin({
  157. filename: `styles/${assetsFilenames}.css`,
  158. allChunks: true,
  159. disable: (config.enabled.watcher),
  160. }),
  161. new webpack.LoaderOptionsPlugin({
  162. minimize: config.enabled.optimize,
  163. debug: config.enabled.watcher,
  164. stats: { colors: true },
  165. }),
  166. new webpack.LoaderOptionsPlugin({
  167. test: /\.s?css$/,
  168. options: {
  169. output: { path: config.paths.dist },
  170. context: config.paths.assets,
  171. },
  172. }),
  173. new webpack.LoaderOptionsPlugin({
  174. test: /\.js$/,
  175. options: {
  176. eslint: { failOnWarning: false, failOnError: true },
  177. },
  178. }),
  179. new FriendlyErrorsWebpackPlugin(),
  180. ].concat(htmlPlugins),
  181. };
  182.  
  183. /* Load other dependencies if needed */
  184.  
  185. if (config.enabled.optimize) {
  186. webpackConfig = merge(webpackConfig, require('./webpack.config.optimize'));
  187. }
  188.  
  189. if (config.env.production) {
  190. webpackConfig.plugins.push(new webpack.NoEmitOnErrorsPlugin());
  191. }
  192.  
  193. if (config.enabled.watcher) {
  194. //webpackConfig.entry = require('./util/addHotMiddleware')(webpackConfig.entry);
  195. webpackConfig = merge(webpackConfig, require('./webpack.config.watch'));
  196. }
  197.  
  198. module.exports = webpackConfig;
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement