1
0

webpack.common.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181
  1. /* eslint-disable camelcase */
  2. const { VueLoaderPlugin } = require('vue-loader')
  3. const path = require('path')
  4. const BabelLoaderExcludeNodeModulesExcept = require('babel-loader-exclude-node-modules-except')
  5. const webpack = require('webpack')
  6. const NodePolyfillPlugin = require('node-polyfill-webpack-plugin')
  7. const modules = require('./webpack.modules.js')
  8. const formatOutputFromModules = (modules) => {
  9. // merge all configs into one object, and use AppID to generate the fileNames
  10. // with the following format:
  11. // AppId-fileName: path/to/js-file.js
  12. const moduleEntries = Object.keys(modules).map(moduleKey => {
  13. const module = modules[moduleKey]
  14. const entries = Object.keys(module).map(entryKey => {
  15. const entry = module[entryKey]
  16. return { [`${moduleKey}-${entryKey}`]: entry }
  17. })
  18. return Object.assign({}, ...Object.values(entries))
  19. })
  20. return Object.assign({}, ...Object.values(moduleEntries))
  21. }
  22. const modulesToBuild = () => {
  23. const MODULE = process?.env?.MODULE
  24. if (MODULE) {
  25. if (!modules[MODULE]) {
  26. throw new Error(`No module "${MODULE}" found`)
  27. }
  28. return formatOutputFromModules({
  29. [MODULE]: modules[MODULE],
  30. })
  31. }
  32. return formatOutputFromModules(modules)
  33. }
  34. module.exports = {
  35. entry: modulesToBuild(),
  36. output: {
  37. // Step away from the src folder and extract to the js folder
  38. path: path.join(__dirname, 'dist'),
  39. // Let webpack determine automatically where it's located
  40. publicPath: 'auto',
  41. filename: '[name].js?v=[contenthash]',
  42. chunkFilename: '[name]-[id].js?v=[contenthash]',
  43. // Make sure sourcemaps have a proper path and do not
  44. // leak local paths https://github.com/webpack/webpack/issues/3603
  45. devtoolNamespace: 'nextcloud',
  46. devtoolModuleFilenameTemplate(info) {
  47. const rootDir = process?.cwd()
  48. const rel = path.relative(rootDir, info.absoluteResourcePath)
  49. return `webpack:///nextcloud/${rel}`
  50. },
  51. clean: {
  52. keep: /icons\.css/, // Keep static icons css
  53. },
  54. },
  55. module: {
  56. rules: [
  57. {
  58. test: /davclient/,
  59. loader: 'exports-loader',
  60. options: {
  61. type: 'commonjs',
  62. exports: 'dav',
  63. },
  64. },
  65. {
  66. test: /\.css$/,
  67. use: ['style-loader', 'css-loader'],
  68. },
  69. {
  70. test: /\.scss$/,
  71. use: ['style-loader', 'css-loader', 'sass-loader'],
  72. },
  73. {
  74. test: /\.vue$/,
  75. loader: 'vue-loader',
  76. exclude: BabelLoaderExcludeNodeModulesExcept([
  77. 'vue-material-design-icons',
  78. 'emoji-mart-vue-fast',
  79. ]),
  80. },
  81. {
  82. test: /\.tsx?$/,
  83. use: 'babel-loader',
  84. exclude: BabelLoaderExcludeNodeModulesExcept([]),
  85. },
  86. {
  87. test: /\.js$/,
  88. loader: 'babel-loader',
  89. // automatically detect necessary packages to
  90. // transpile in the node_modules folder
  91. exclude: BabelLoaderExcludeNodeModulesExcept([
  92. '@nextcloud/dialogs',
  93. '@nextcloud/event-bus',
  94. '@nextcloud/vue-dashboard',
  95. 'davclient.js',
  96. 'nextcloud-vue-collections',
  97. 'p-finally',
  98. 'p-limit',
  99. 'p-locate',
  100. 'p-queue',
  101. 'p-timeout',
  102. 'p-try',
  103. 'semver',
  104. 'striptags',
  105. 'toastify-js',
  106. 'v-tooltip',
  107. 'yocto-queue',
  108. ]),
  109. },
  110. {
  111. test: /\.(png|jpe?g|gif|svg|woff2?|eot|ttf)$/,
  112. type: 'asset/inline',
  113. },
  114. {
  115. test: /\.handlebars/,
  116. loader: 'handlebars-loader',
  117. },
  118. {
  119. resourceQuery: /raw/,
  120. type: 'asset/source',
  121. },
  122. ],
  123. },
  124. optimization: {
  125. splitChunks: {
  126. automaticNameDelimiter: '-',
  127. cacheGroups: {
  128. vendors: {
  129. // split every dependency into one bundle
  130. test: /[\\/]node_modules[\\/]/,
  131. enforce: true,
  132. // necessary to keep this name to properly inject it
  133. // see OC_Template.php
  134. name: 'core-common',
  135. chunks: 'all',
  136. },
  137. },
  138. },
  139. },
  140. plugins: [
  141. new VueLoaderPlugin(),
  142. new NodePolyfillPlugin(),
  143. new webpack.ProvidePlugin({
  144. // Provide jQuery to jquery plugins as some are loaded before $ is exposed globally.
  145. // We need to provide the path to node_moduels as otherwise npm link will fail due
  146. // to tribute.js checking for jQuery in @nextcloud/vue
  147. jQuery: path.resolve(path.join(__dirname, 'node_modules/jquery')),
  148. // Shim ICAL to prevent using the global object (window.ICAL).
  149. // The library ical.js heavily depends on instanceof checks which will
  150. // break if two separate versions of the library are used (e.g. bundled one
  151. // and global one).
  152. ICAL: 'ical.js',
  153. }),
  154. ],
  155. externals: {
  156. OC: 'OC',
  157. OCA: 'OCA',
  158. OCP: 'OCP',
  159. },
  160. resolve: {
  161. alias: {
  162. // make sure to use the handlebar runtime when importing
  163. handlebars: 'handlebars/runtime',
  164. },
  165. extensions: ['*', '.ts', '.js', '.vue'],
  166. symlinks: true,
  167. fallback: {
  168. fs: false,
  169. },
  170. },
  171. }