webpack.config.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329
  1. const path = require('path');
  2. const HtmlWebpackPlugin = require('html-webpack-plugin');
  3. const CleanWebpackPlugin = require('clean-webpack-plugin') // 清空打包目录的插件
  4. const MiniCssExtractPlugin = require('mini-css-extract-plugin');
  5. const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
  6. const webpack = require('webpack');
  7. const proxyHost = "http://192.168.2.241:6060";
  8. module.exports = {
  9. entry: {
  10. index: path.resolve(__dirname, 'src/js', 'index.js'),
  11. page: path.resolve(__dirname, 'src', 'page.js'),
  12. information: path.resolve(__dirname, 'src/js', 'information.js'),
  13. disclaimer: path.resolve(__dirname, 'src/js', 'disclaimer.js'),
  14. version: path.resolve(__dirname, 'src/js', 'version.js'),
  15. scale: path.resolve(__dirname, 'src/js', 'scale.js'),
  16. illness: path.resolve(__dirname, 'src/js', 'illness.js'),
  17. treatplan: path.resolve(__dirname, 'src/js', 'treatplan.js'),
  18. indexHorizontal: path.resolve(__dirname, 'src/js', 'indexHorizontal.js'),
  19. staticSearch: path.resolve(__dirname, 'src/js', 'staticSearch.js'),
  20. emergency: path.resolve(__dirname, 'src/js', 'emergency.js'),
  21. icssIndex: path.resolve(__dirname, 'src/js', 'icssIndex.js'),
  22. view: path.resolve(__dirname, 'src/js', 'view.js'),
  23. cdss: path.resolve(__dirname, 'src/js', 'cdss.js'),
  24. vendor: 'lodash'// 多个页面所需的公共库文件,防止重复打包带入
  25. },
  26. output: {
  27. publicPath: '/', //这里要放的是静态资源CDN的地址
  28. path: path.resolve(__dirname, 'dist'),
  29. filename: 'js/[name].js'
  30. },
  31. resolve: {
  32. extensions: [".js", ".css", ".json"],
  33. alias: {} //配置别名可以加快webpack查找模块的速度
  34. },
  35. plugins: [// 多入口的html文件用chunks这个参数来区分
  36. new HtmlWebpackPlugin({
  37. title: 'index',
  38. template: path.resolve(__dirname, 'src/html', 'index.html'),
  39. filename: 'index.html',
  40. chunks: ['index', 'vendor', 'common'],
  41. inject: true,
  42. hash: true, //防止缓存
  43. minify: {
  44. removeAttributeQuotes: true, //压缩 去掉引号
  45. removeComments: true, //移除HTML中的注释
  46. collapseWhitespace: true //删除空白符与换行符
  47. }
  48. }),
  49. new HtmlWebpackPlugin({
  50. title: '病情提示',
  51. template: path.resolve(__dirname, 'src/html', 'illness.html'),
  52. filename: 'illness.html',
  53. chunks: ['illness', 'vendor', 'common'],
  54. inject: true,
  55. hash: true, //防止缓存
  56. minify: {
  57. removeAttributeQuotes: true, //压缩 去掉引号
  58. removeComments: true, //移除HTML中的注释
  59. collapseWhitespace: true //删除空白符与换行符
  60. }
  61. }),
  62. new HtmlWebpackPlugin({
  63. title: '治疗方案',
  64. template: path.resolve(__dirname, 'src/html', 'treatplan.html'),
  65. filename: 'treatplan.html',
  66. chunks: ['treatplan', 'vendor', 'common'],
  67. inject: true,
  68. hash: true, //防止缓存
  69. minify: {
  70. removeAttributeQuotes: true, //压缩 去掉引号
  71. removeComments: true, //移除HTML中的注释
  72. collapseWhitespace: true //删除空白符与换行符
  73. }
  74. }),
  75. new HtmlWebpackPlugin({
  76. title: 'page',
  77. template: path.resolve(__dirname, 'src/html', 'page.html'),
  78. filename: 'page.html',
  79. chunks: ['page', 'vendor', 'common'],
  80. inject: true,
  81. hash: true, //防止缓存
  82. minify: {
  83. removeAttributeQuotes: true, //压缩 去掉引号
  84. removeComments: true, //移除HTML中的注释
  85. collapseWhitespace: true //删除空白符与换行符
  86. }
  87. }),
  88. new HtmlWebpackPlugin({
  89. title: 'information',
  90. template: path.resolve(__dirname, 'src/html', 'information.html'),
  91. filename: 'information.html',
  92. chunks: ['information', 'vendor', 'common'],
  93. inject: true,
  94. hash: true, //防止缓存
  95. minify: {
  96. removeAttributeQuotes: true, //压缩 去掉引号
  97. removeComments: true, //移除HTML中的注释
  98. collapseWhitespace: true //删除空白符与换行符
  99. }
  100. }),
  101. new HtmlWebpackPlugin({
  102. title: 'drugInfo',
  103. template: path.resolve(__dirname, 'src/html', 'drugInfo.html'),
  104. filename: 'drugInfo.html',
  105. chunks: ['information', 'vendor', 'common'],
  106. inject: true,
  107. hash: true, //防止缓存
  108. minify: {
  109. removeAttributeQuotes: true, //压缩 去掉引号
  110. removeComments: true, //移除HTML中的注释
  111. collapseWhitespace: true //删除空白符与换行符
  112. }
  113. }),
  114. new HtmlWebpackPlugin({
  115. title: '免责声明',
  116. template: path.resolve(__dirname, 'src/html', 'disclaimer.html'),
  117. filename: 'disclaimer.html',
  118. chunks: ['vendor', 'common', 'disclaimer'],
  119. inject: true,
  120. hash: true, //防止缓存
  121. minify: {
  122. removeAttributeQuotes: true, //压缩 去掉引号
  123. removeComments: true, //移除HTML中的注释
  124. collapseWhitespace: true //删除空白符与换行符
  125. }
  126. }),
  127. new HtmlWebpackPlugin({
  128. title: '版本信息',
  129. template: path.resolve(__dirname, 'src/html', 'version.html'),
  130. filename: 'version.html',
  131. chunks: ['vendor', 'common', 'version'],
  132. inject: true,
  133. hash: true, //防止缓存
  134. minify: {
  135. removeAttributeQuotes: true, //压缩 去掉引号
  136. removeComments: true, //移除HTML中的注释
  137. collapseWhitespace: true //删除空白符与换行符
  138. }
  139. }),
  140. new HtmlWebpackPlugin({
  141. title: 'scale',
  142. template: path.resolve(__dirname, 'src/html', 'scale.html'),
  143. filename: 'scale.html',
  144. chunks: ['vendor', 'common', 'scale'],
  145. inject: true,
  146. hash: true, //防止缓存
  147. minify: {
  148. removeAttributeQuotes: true, //压缩 去掉引号
  149. removeComments: true, //移除HTML中的注释
  150. collapseWhitespace: true //删除空白符与换行符
  151. }
  152. }),
  153. new HtmlWebpackPlugin({
  154. title: 'indexHorizontal',
  155. template: path.resolve(__dirname, 'src/html', 'indexHorizontal.html'),
  156. filename: 'indexHorizontal.html',
  157. chunks: ['indexHorizontal', 'vendor', 'common'],
  158. inject: true,
  159. hash: true, //防止缓存
  160. minify: {
  161. removeAttributeQuotes: true, //压缩 去掉引号
  162. removeComments: true, //移除HTML中的注释
  163. collapseWhitespace: true //删除空白符与换行符
  164. }
  165. }),
  166. new HtmlWebpackPlugin({
  167. title: 'staticSearch',
  168. template: path.resolve(__dirname, 'src/html', 'staticSearch.html'),
  169. filename: 'staticSearch.html',
  170. chunks: ['staticSearch', 'vendor', 'common'],
  171. inject: true,
  172. hash: true, //防止缓存
  173. minify: {
  174. removeAttributeQuotes: true, //压缩 去掉引号
  175. removeComments: true, //移除HTML中的注释
  176. collapseWhitespace: true //删除空白符与换行符
  177. }
  178. }),
  179. new HtmlWebpackPlugin({
  180. title: 'emergency',
  181. template: path.resolve(__dirname, 'src/html', 'emergency.html'),
  182. filename: 'emergency.html',
  183. chunks: ['emergency', 'vendor', 'common'],
  184. inject: true,
  185. hash: true, //防止缓存
  186. minify: {
  187. removeAttributeQuotes: true, //压缩 去掉引号
  188. removeComments: true, //移除HTML中的注释
  189. collapseWhitespace: true //删除空白符与换行符
  190. }
  191. }),
  192. new HtmlWebpackPlugin({
  193. title: 'icssIndex',
  194. template: path.resolve(__dirname, 'src/html', 'icssIndex.html'),
  195. filename: 'icssIndex.html',
  196. chunks: ['icssIndex', 'vendor', 'common'],
  197. inject: true,
  198. hash: true, //防止缓存
  199. minify: {
  200. removeAttributeQuotes: true, //压缩 去掉引号
  201. removeComments: true, //移除HTML中的注释
  202. collapseWhitespace: true //删除空白符与换行符
  203. }
  204. }),
  205. new HtmlWebpackPlugin({
  206. title: 'cdss',
  207. template: path.resolve(__dirname, 'src/html', 'cdss.html'),
  208. filename: 'cdss.html',
  209. chunks: ['cdss', 'vendor', 'common'],
  210. inject: true,
  211. hash: true, //防止缓存
  212. minify: {
  213. removeAttributeQuotes: true, //压缩 去掉引号
  214. removeComments: true, //移除HTML中的注释
  215. collapseWhitespace: true //删除空白符与换行符
  216. }
  217. }),
  218. new HtmlWebpackPlugin({
  219. title: 'view',
  220. template: path.resolve(__dirname, 'src/html', 'view.html'),
  221. filename: 'view.html',
  222. chunks: ['view', 'vendor', 'common'],
  223. inject: true,
  224. hash: true, //防止缓存
  225. minify: {
  226. removeAttributeQuotes: true, //压缩 去掉引号
  227. removeComments: true, //移除HTML中的注释
  228. collapseWhitespace: true //删除空白符与换行符
  229. }
  230. }),
  231. new MiniCssExtractPlugin({
  232. filename: 'css/[name].css',
  233. chunkFilename: '[id].css'
  234. }),
  235. new webpack.HotModuleReplacementPlugin(),
  236. new CleanWebpackPlugin()
  237. ],
  238. optimization: { //webpack4.x的最新优化配置项,用于提取公共代码
  239. minimizer: [
  240. new UglifyJsPlugin({
  241. uglifyOptions: {
  242. ie8: true,
  243. compress: {
  244. properties: false,
  245. warnings: false
  246. },
  247. mangle: {
  248. screw_ie8: false,
  249. except: ['e']
  250. },
  251. output: {
  252. beautify: true
  253. },
  254. sourceMap: false
  255. }
  256. })
  257. ],
  258. splitChunks: {
  259. cacheGroups: {
  260. commons: {
  261. chunks: "initial",
  262. name: "common",
  263. minChunks: 2,
  264. maxInitialRequests: 5, // The default limit is too small to showcase the effect
  265. minSize: 0, // This is example is too small to create commons chunks
  266. reuseExistingChunk: true // 可设置是否重用该chunk
  267. }
  268. }
  269. }
  270. },
  271. module: {
  272. rules: [
  273. {
  274. test: /.js$/,
  275. enforce: 'post',
  276. loader: 'es3ify-loader'
  277. },
  278. {
  279. test: /\.m?js$/,
  280. exclude: /(node_modules|bower_components)/,
  281. use: {
  282. loader: 'babel-loader',
  283. options: {
  284. presets:['@babel/preset-env']
  285. }
  286. }
  287. },
  288. {
  289. test: /\.css$/,
  290. use: [{
  291. loader: MiniCssExtractPlugin.loader
  292. },
  293. 'css-loader'
  294. ]
  295. },
  296. {
  297. test: /\.less$/,
  298. use : [
  299. MiniCssExtractPlugin.loader,
  300. { loader: "css-loader" },
  301. { loader: "less-loader" }
  302. ]},
  303. {
  304. test: /\.(png|jpg|jpeg|gif|svg)$/,
  305. use: {
  306. loader: 'file-loader',
  307. options: {
  308. outputPath: 'images/', // 图片输出的路径和存储路径保持一致
  309. limit: 10000,
  310. name: '[name].[ext]'
  311. }
  312. }
  313. }
  314. ]
  315. },
  316. // devtool: 'cheap-module-eval-source-map', //开发环境cheap-module-eval-source-map //生产环境cheap-module-source-map
  317. mode: 'development',
  318. devServer: {
  319. contentBase: "./dist", //静态文件根目录
  320. proxy: {
  321. '*': proxyHost
  322. },
  323. hot: true,
  324. // openPage:'index.html?age=28&tipsName=血常规&tipsType=12&diseaseId=280&lisJson=&diagJson=急性胰腺炎&diseaseName=糖尿病&pastJson=无心脏病&otherJson=无高血压&pacsJson=腹部B超:无异常,%20报告日期:2019-05-07&sex=男&symptomJson=恶心呕吐腰痛&vitalJson=血压左上肢13/12mmHg&hospitalCode=A001',
  325. openPage:'cdss.html?mrId=200821362618001909'
  326. },
  327. stats: { children: false }
  328. }