[#34604] - [4.0] build scripts javascript
- Closed
- 23 Jun 2021
- Medium
- Build: staging
- # 34604
I'm not sure if this is the expected behaviour - could someone confirm please
I have a third party javascript file that I want to include in core in a new a11y plugin. It is not available via npm.
These are the steps I followed
- created a folder
build\media_source\plg_system_name\js - copied name.js to that folder
- created a folder
build\media_source\plg_system_name\css - copied name.css to that folder
I then ran the build scripts and expected to see these files copied etc to the \media\plg_system_name folder
The css is copied but the js folder remains empty
Tested renaming the js file in media_source to name.es5.js and that worked - the files were created and renamed and minified. Is that the way to do this? I expected the file to be just copied and minified without having to rename it
joomla-cms-bot
- | Labels |
Added:
?
|
||
Looks as if that was by purpose: https://github.com/joomla/joomla-cms/blob/4.0-dev/build/build-modules-js/compilejs.es6.js#L61-L71
From the docs, https://github.com/joomla/joomla-cms/blob/4.0-dev/build/README.md:
Javascript
There are three options here:
-
Modern Javascript files should have an extension
.es6.js.
This allows the ESLint to check the style code, Joomla is using the AirBnB preset https://github.com/airbnb/javascript
Also it instructs Rollup to do the transforms for ES2017 and then transpile to ES5. This step creates normal and minified files.
Production code WILL NOT have the.es6part part for ES2017+ files but WILL HAVE a-es5.jsfor the ES5 ones -
Web Component Javascript files should have an extension
.w-c.es6.js.
This allows the ESLint to check the code and it instructs Rollup to do the transforms for ES2017 and then transpile to ES5. This step creates normal and minified files. The difference with the.es6files is that the tools will automate the minification of the css (assuming that the appropriate scss file exists) and injected into the js file into a placeholder{{CSS_CONTENTS_PLACEHOLDER}}(ie:build/media_source/system/js/joomla-core-loader.w-c.es6.js)
Production code WILL NOT have the.w-c.es6part for ES2017+ files but WILL HAVE a-es5.jsfor the ES5 ones -
Legacy Javascript files should have an extension
.es5.js.
This instructs ESLint to skip checking this file
Also it instructs the tools to create a minified version (production code WILL NOT have the.es5part)
Thanks for clarification.
The doc needs updating to say "must" instead of "should". Must is a hard requirement. Should is only a recommendation.
And I would add a fourth bullet point to say "javascript files that only have the extension .js will be ignored
| Status | New | ⇒ | Closed |
| Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2021-06-23 13:49:05 |
| Closed_By | ⇒ | brianteeman |
@dgrammatiko Thanks a lot for your help.
Ping @dgrammatiko .