webpack.base.conf.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. var path = require('path')
  2. var fs = require('fs')
  3. var utils = require('./utils')
  4. var config = require('../config')
  5. var webpack = require('webpack')
  6. var merge = require('webpack-merge')
  7. var vueLoaderConfig = require('./vue-loader.conf')
  8. var MpvuePlugin = require('webpack-mpvue-asset-plugin')
  9. var glob = require('glob')
  10. var CopyWebpackPlugin = require('copy-webpack-plugin')
  11. var relative = require('relative')
  12. function resolve (dir) {
  13. return path.join(__dirname, '..', dir)
  14. }
  15. function getEntry (rootSrc) {
  16. var map = {};
  17. glob.sync(rootSrc + '/pages/**/main.js')
  18. .forEach(file => {
  19. var key = relative(rootSrc, file).replace('.js', '');
  20. map[key] = file;
  21. })
  22. return map;
  23. }
  24. const appEntry = { app: resolve('./src/main.js') }
  25. const pagesEntry = getEntry(resolve('./src'), 'pages/**/main.js')
  26. const entry = Object.assign({}, appEntry, pagesEntry)
  27. let baseWebpackConfig = {
  28. // 如果要自定义生成的 dist 目录里面的文件路径,
  29. // 可以将 entry 写成 {'toPath': 'fromPath'} 的形式,
  30. // toPath 为相对于 dist 的路径, 例:index/demo,则生成的文件地址为 dist/index/demo.js
  31. entry,
  32. target: require('mpvue-webpack-target'),
  33. output: {
  34. path: config.build.assetsRoot,
  35. jsonpFunction: 'webpackJsonpMpvue',
  36. filename: '[name].js',
  37. publicPath: process.env.NODE_ENV === 'production'
  38. ? config.build.assetsPublicPath
  39. : config.dev.assetsPublicPath
  40. },
  41. resolve: {
  42. extensions: ['.js', '.vue', '.json'],
  43. alias: {
  44. 'vue': 'mpvue',
  45. '@': resolve('src')
  46. },
  47. symlinks: false,
  48. aliasFields: ['mpvue', 'weapp', 'browser'],
  49. mainFields: ['browser', 'module', 'main']
  50. },
  51. module: {
  52. rules: [
  53. // {
  54. // test: /\.(js|vue)$/,
  55. // loader: 'eslint-loader',
  56. // enforce: 'pre',
  57. // include: [resolve('src'), resolve('test')],
  58. // options: {
  59. // formatter: require('eslint-friendly-formatter')
  60. // }
  61. // },
  62. {
  63. test: /\.vue$/,
  64. loader: 'mpvue-loader',
  65. options: vueLoaderConfig
  66. },
  67. {
  68. test: /\.js$/,
  69. include: [resolve('src'), resolve('test')],
  70. use: [
  71. 'babel-loader',
  72. {
  73. loader: 'mpvue-loader',
  74. options: Object.assign({checkMPEntry: true}, vueLoaderConfig)
  75. },
  76. ]
  77. },
  78. {
  79. test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
  80. loader: 'url-loader',
  81. options: {
  82. limit: 10000,
  83. name: utils.assetsPath('img/[name].[ext]')
  84. }
  85. },
  86. {
  87. test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
  88. loader: 'url-loader',
  89. options: {
  90. limit: 10000,
  91. name: utils.assetsPath('media/[name].[ext]')
  92. }
  93. },
  94. {
  95. test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
  96. loader: 'url-loader',
  97. options: {
  98. limit: 10000,
  99. name: utils.assetsPath('fonts/[name].[ext]')
  100. }
  101. },
  102. {
  103. test: /\.scss$/,
  104. loader: ["style", "css", "sass"]
  105. }
  106. ]
  107. },
  108. plugins: [
  109. // api 统一桥协议方案
  110. new webpack.DefinePlugin({
  111. 'mpvue': 'global.mpvue',
  112. 'mpvuePlatform': 'global.mpvuePlatform'
  113. }),
  114. new MpvuePlugin(),
  115. new CopyWebpackPlugin([{
  116. from: '**/*.json',
  117. to: ''
  118. }], {
  119. context: 'src/'
  120. }),
  121. new CopyWebpackPlugin([
  122. {
  123. from: path.resolve(__dirname, '../static'),
  124. to: path.resolve(config.build.assetsRoot, './static'),
  125. ignore: ['.*']
  126. }
  127. ])
  128. ]
  129. }
  130. // 针对百度小程序,由于不支持通过 miniprogramRoot 进行自定义构建完的文件的根路径
  131. // 所以需要将项目根路径下面的 project.swan.json 拷贝到构建目录
  132. // 然后百度开发者工具将 dist/swan 作为项目根目录打
  133. const projectConfigMap = {
  134. tt: '../project.config.json',
  135. swan: '../project.swan.json'
  136. }
  137. const PLATFORM = process.env.PLATFORM
  138. if (/^(swan)|(tt)$/.test(PLATFORM)) {
  139. baseWebpackConfig = merge(baseWebpackConfig, {
  140. plugins: [
  141. new CopyWebpackPlugin([{
  142. from: path.resolve(__dirname, projectConfigMap[PLATFORM]),
  143. to: path.resolve(config.build.assetsRoot)
  144. }])
  145. ]
  146. })
  147. }
  148. module.exports = baseWebpackConfig