webpack.prod.config.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. const webpack = require('webpack')
  2. const path = require('path')
  3. const HtmlWebpackPlugin = require('html-webpack-plugin') //html插件
  4. const ExtractTextPlugin = require("extract-text-webpack-plugin")//文本插件
  5. const readEntryFile = require('./webpack.common.js')
  6. const autoprefixer = require('autoprefixer')
  7. const postcssSprites = require('postcss-sprites')
  8. const svnpath = '../../../pub' || 'D://fed/pub'//支持相对和绝对地址
  9. const version = '1.0.0'
  10. const filepath = '/zt2017/webpack/'
  11. const staticPath = /:\/\//.test(svnpath) ? path.join(svnpath, filepath, version) : path.join(__dirname, svnpath, filepath, version)//根据相对还是绝对地址拼接成绝对地址
  12. const cdn = ['//pub.dwstatic.com', filepath, version].join('')
  13. /**
  14. * 默认入口是有vendor的 如果不需要可以去除
  15. */
  16. var entry = {
  17. vendor: 'jquery'
  18. }
  19. var plugins = [
  20. new webpack.optimize.CommonsChunkPlugin('vendor'),
  21. new webpack.optimize.UglifyJsPlugin(),
  22. new webpack.ProvidePlugin({
  23. $: "jquery",
  24. jQuery: "jquery",
  25. "window.jQuery": "jquery"
  26. }),
  27. new webpack.DefinePlugin({
  28. 'process.env': {
  29. 'NODE_ENV': JSON.stringify('production')
  30. }
  31. }),
  32. new ExtractTextPlugin({
  33. filename: "css/global_[contenthash:6].css"
  34. }),
  35. ]
  36. readEntryFile().forEach(function (file) {
  37. plugins.push(new HtmlWebpackPlugin({
  38. filename: file.name + '.html',
  39. template: file.htmlentry,
  40. inject: 'head',
  41. chunksSortMode: 'manual',
  42. chunks: ['vendor', file.name],
  43. }))
  44. entry[file.name] = file.jsentry
  45. }, this);
  46. module.exports = {
  47. entry: entry,
  48. output: {
  49. publicPath: cdn,
  50. filename: 'js/[name]_[chunkhash:6].js',
  51. path: path.resolve(staticPath, '')
  52. },
  53. module: {
  54. rules: [
  55. {
  56. test: /\.js$/,
  57. use: [{
  58. loader: 'babel-loader'
  59. }],
  60. exclude: /node_modules/,
  61. },
  62. {
  63. test: /\.css$/,
  64. use: ExtractTextPlugin.extract({
  65. fallback: "style-loader",
  66. use: "css-loader",
  67. publicPath: path.resolve(cdn, './css')
  68. })
  69. },
  70. {
  71. test: /\.scss$/, use: ExtractTextPlugin.extract({
  72. fallback: 'style-loader',
  73. publicPath: path.resolve(cdn, './css'),
  74. use: [{
  75. loader: "css-loader",
  76. }, {
  77. loader: "postcss-loader",
  78. options: {
  79. ident: 'postcss',
  80. plugins: () => [
  81. autoprefixer({
  82. browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4'],
  83. }),
  84. postcssSprites({
  85. // stylesheetPath: './src/img',
  86. spritePath: path.resolve(staticPath, './img/sprite'),
  87. filterBy: [
  88. function (image) {
  89. if (image.originalUrl.indexOf('?__sprite') === -1) {
  90. return Promise.reject()
  91. }
  92. return Promise.resolve()
  93. }
  94. ]
  95. })
  96. ],
  97. },
  98. }, {
  99. loader: "sass-loader"
  100. }]
  101. })
  102. },
  103. {
  104. test: require.resolve('jquery'),
  105. use: [{
  106. loader: 'expose-loader',
  107. options: 'jQuery'
  108. }, {
  109. loader: 'expose-loader',
  110. options: '$'
  111. }]
  112. },
  113. {
  114. test: /\.(gif|jpg|png|woff|svg|eot|ttf)\??.*$/,
  115. loader: 'file-loader',
  116. options: {
  117. publicPath: cdn,
  118. outputPath: '/img/',
  119. name(file) {
  120. if (file.indexOf('sprite') === -1)
  121. return '[name]_[hash:6].[ext]'
  122. else
  123. return 'sprite/[name]_[hash:6].[ext]'
  124. },
  125. }
  126. },
  127. {
  128. test: /\.tmpl$/,
  129. use: 'raw-loader'
  130. }
  131. ]
  132. },
  133. // devtool: 'source-map',
  134. plugins: plugins
  135. }