[wp-trac] [WordPress Trac] #49423: Build: Create Webpack build configuration for vendor dependencies

WordPress Trac noreply at wordpress.org
Wed Feb 12 21:20:19 UTC 2020


#49423: Build: Create Webpack build configuration for vendor dependencies
------------------------------+-----------------------------
 Reporter:  aduth             |      Owner:  (none)
     Type:  enhancement       |     Status:  new
 Priority:  normal            |  Milestone:  Awaiting Review
Component:  Build/Test Tools  |    Version:
 Severity:  normal            |   Keywords:  has-patch
  Focuses:  javascript        |
------------------------------+-----------------------------
 Related: #49360, #46110 (could be considered a blocker for #49360)

 The current process for including third-party JavaScript dependencies
 (jQuery, Moment, etc) occurs as a combination of:

 - [https://github.com/WordPress/wordpress-
 develop/blob/3dd39ffecea808afe86b8071331551d9d5e8cf89/Gruntfile.js#L164-L231
 Gruntfile task]
 - [https://github.com/WordPress/wordpress-
 develop/blob/3dd39ffecea808afe86b8071331551d9d5e8cf89/tools/webpack/packages.js#L74-L86
 Webpack packages build]

 For both of these, they are performed as simple file copying from
 `node_modules`.

 This has a few downsides, related to depending on the package to
 prepackage "browser-ready" scripts:

 - Cannot use a package if it uses CommonJS or other module import
 semantics (See: ticket:49360#comment:6)
 - Cannot use a package if its code is not transpiled to run in ES5
 environments like Internet Explorer (see #46110)
 - We must run Uglify minification directly for packages if it does not
 include a minified distributable

 All of these problems could be addressed by incorporating the vendor
 dependencies into the Webpack build process.

 - Webpack can resolve module import semantics and output browser-ready
 artifacts
 - When configured to use the package's default entrypoint (`package.json`
 `main`) and assuming that entrypoint is ES5-ready, the output should also
 be ES5-ready. Note that the problems of #46110 are a bit more nuanced,
 related to
 [https://github.com/jimmywarting/FormData/issues/69#issuecomment-462791447
 upstream issues of the package in question]. We probably want to expect
 that dependencies are already transpiled; ideally we would not need to
 incorporate something like Babel as part of this configuration.
 - Webpack has [https://webpack.js.org/configuration/optimization/ built-in
 minification handling].

 This could technically be done within the existing `packages`
 configuration, but there's enough differences between packages and vendor
 scripts (both technically and conceptually) that it would make sense to
 extract this to its own configuration. There is already precedent here
 with having a separate configuration for media scripts.

 See attached patch for proposed implementation.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/49423>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform


More information about the wp-trac mailing list