webpack.dev.conf.js 3.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. 'use strict'
  2. const utils = require('./utils')
  3. const webpack = require('webpack')
  4. const config = require('../config')
  5. const merge = require('webpack-merge')
  6. const path = require('path')
  7. const baseWebpackConfig = require('./webpack.base.conf')
  8. const CopyWebpackPlugin = require('copy-webpack-plugin')
  9. const HtmlWebpackPlugin = require('html-webpack-plugin')
  10. const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
  11. const portfinder = require('portfinder')
  12. const HOST = process.env.HOST
  13. const PORT = process.env.PORT && Number(process.env.PORT)
  14. let configPlugin = [
  15. new webpack.DefinePlugin({
  16. 'process.env': require('../config/dev.env'),
  17. 'GLOBAL_DATE': new Date().getMonth() + 1 + '.' + new Date().getDate()
  18. }),
  19. new webpack.HotModuleReplacementPlugin(),
  20. new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
  21. new webpack.NoEmitOnErrorsPlugin(),
  22. // copy custom static assets
  23. new CopyWebpackPlugin([{
  24. from: path.resolve(__dirname, '../static'),
  25. to: config.dev.assetsSubDirectory,
  26. ignore: ['.*']
  27. }]),
  28. new webpack.ProvidePlugin({
  29. eBase: [path.resolve(__dirname, '..', 'src/base/eBase.js'),'default']
  30. })
  31. ];
  32. configPlugin.push(...utils.getDevHtmlPlugins());
  33. const devWebpackConfig = merge(baseWebpackConfig, {
  34. module: {
  35. rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
  36. },
  37. // cheap-module-eval-source-map is faster for development
  38. devtool: config.dev.devtool,
  39. // these devServer options should be customized in /config/index.js
  40. devServer: {
  41. clientLogLevel: 'warning',
  42. historyApiFallback: {
  43. rewrites: [
  44. { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
  45. ],
  46. },
  47. hot: true,
  48. contentBase: false, // since we use CopyWebpackPlugin.
  49. compress: true,
  50. host: HOST || config.dev.host,
  51. port: PORT || config.dev.port,
  52. open: config.dev.autoOpenBrowser,
  53. overlay: config.dev.errorOverlay ? { warnings: false, errors: true } : false,
  54. publicPath: config.dev.assetsPublicPath,
  55. proxy: config.dev.proxyTable,
  56. quiet: true, // necessary for FriendlyErrorsPlugin
  57. watchOptions: {
  58. poll: config.dev.poll,
  59. }
  60. },
  61. plugins: configPlugin
  62. })
  63. module.exports = new Promise((resolve, reject) => {
  64. portfinder.basePort = process.env.PORT || config.dev.port
  65. portfinder.getPort((err, port) => {
  66. if (err) {
  67. reject(err)
  68. } else {
  69. // publish the new Port, necessary for e2e tests
  70. process.env.PORT = port
  71. // add port to devServer config
  72. devWebpackConfig.devServer.port = port
  73. // Add FriendlyErrorsPlugin
  74. devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
  75. compilationSuccessInfo: {
  76. messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
  77. },
  78. onErrors: config.dev.notifyOnErrors ?
  79. utils.createNotifierCallback() : undefined
  80. }))
  81. resolve(devWebpackConfig)
  82. }
  83. })
  84. })