webpack.base.conf.js 4.3 KB

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