Move fomantic and jQuery to main webpack bundle (#11997)
This saves around 3 MB binary size by not including useless fomantic
files in the build. Also, this allows us to move jQuery into the main
bundle as well which eliminates a few HTTP requests.
Also included are webpack config changes:
- split less and css loaders to speed up compliation
- enable css sourcemaps
- switch css minfier plugin to cssnano-webpack-plugin which works better
for sourcemaps than the previous plugin
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
* Add automatic JS license generation
Removed librejs file and replaced it with a plaintext file that is built
from all JS dependencies that are included in the webpack build. It does
not cover the few remaining statically vendored files and fomantic is
added manually because it's not yet in the webpack build process.
Fixes: https://github.com/go-gitea/gitea/issues/11630
* fix lint
* remove jslicense, we're not librejs compatible any more
* remove license.txt test as it depens on absent files
* small optimization
* trailing comma
* localize and capitalize the word 'licenses'
* reduce text to just 'Licenses'
Co-authored-by: Lauris BH <lauris@nix.lv>
Replace jquery-datetimepicker with native date input (#11684)
This removes the jQuery plugin as well as the associated config options.
Native input[type=date] does not require a language attribute as it is
localized by default, except for the placeholder attribute for which I
currently piggy-back the repo.issues.due_date_form localization option.
Implementation should pretty much match GH. Of note is that Safari does
not provide a UI for this input type, but I don't think providing one is
neccessary and GH did not bother either.
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
Ensure serviceworker is created as /serviceworker.js (#11577)
#11538 moved the serviceworker to webbox but unfortunately
created the serviceworker in public/js rather than public/
This PR fixes this, fixing multiple issues with broken js
as a result of that change.
Signed-off-by: Andrew Thornton art27@cantab.net
Move serviceworker to workbox and fix SSE interference (#11538)
* Move serviceworker to workbox and fix SSE interference
Instead of statically hardcoding every frontend asset, this uses a
type-based approach to cache all js,css and manifest.json requests.
This also fixes the issue that the service worker was interfering with
EventSource because it was unconditionally handling all requests which
this new implementation doesn't.
Fixes: https://github.com/go-gitea/gitea/issues/11092
Fixes: https://github.com/go-gitea/gitea/issues/7372
* rethrow error instead of logging
* await .register
* Revert "rethrow error instead of logging"
This reverts commit 043162ba1f.
* improve comment
* remove JSRenderer
* add version-based cache invalidation
* refactor
* more refactor
* remove comment
* rename item to fit cache name
Co-authored-by: guillep2k <18600385+guillep2k@users.noreply.github.com>
* Switch code editor to Monaco
This switches out CodeMirror for Monaco which is based on the same code
base as VS code and should work pretty similar to it.
It does add a few async chunks, totalling around 10MB to our build. It
currently supports around 65 languages and in the default configuration,
each language would emit one ugly [number].js chunk, so I opted to
combine them all into a single file for now.
CodeMirror is still being used under the hood by SimpleMDE so it can not
be removed yet.
* inline editorconfig, fix diff, use for markdown, remove more dead code
* refactors, remove jquery usage
* use tab_width
* fix intellisense
* rename function for clarity
* misc tweaks, enable webpack progress display
* only use --progress on dev build
* remove useless borders in arc-green
* fix typo
* remove obsolete comment
* small refactor
* fix file creation and various refactors
* unset useTabStops too when no editorconfig
* small refactor
* disable webpack's [big] warnings
* remove useless await
* fix dark theme check
* rename chunk to 'monaco'
* add to .gitignore and delete webpack dest before build
* increase editor height
* support more editorconfig properties
* remove empty element filter
* rename
Co-authored-by: John Olheiser <john.olheiser@gmail.com>
Patch fomantic-ui to workaround build issue (#11244)
* Patch fomantic-ui to workaround build issue
Better workaround than https://github.com/go-gitea/gitea/issues/10653
for https://github.com/fomantic/Fomantic-UI/issues/1356. It does not
seem like we're getting a new Fomantic-UI release anytime soon, so
this patches it after node_modules installation.
Fixes: https://github.com/go-gitea/gitea/issues/11243
Fixes: https://github.com/go-gitea/gitea/issues/10679
* copy instead of patch
* update package-lock.json
* Update Makefile
Co-Authored-By: Sorien <Sorien@users.noreply.github.com>
* Update web_src/fomantic/css.js
Co-Authored-By: zeripath <art27@cantab.net>
Co-authored-by: Sorien <Sorien@users.noreply.github.com>
Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: guillep2k <18600385+guillep2k@users.noreply.github.com>
This should eliminate page freezes when loading big files/diff.
`highlightBlock` is needed to preserve existing nodes when highlighting
and for that, highlight.js needs access to the DOM API so I added a DOM
implementation to make it work, which adds around 300kB to the output
file size of the lazy-loaded `highlight.js`.
Co-authored-by: Lauris BH <lauris@nix.lv>
move jquery-datetimepicker to npm/webpack (#10713)
- update to latest version and move to npm
- adapt for api changes and css class rename
- add specificity to arc-green rules as dependency css now loads later
- use imports-loader to make it load correctly
- fix some wrong paths in librejs
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
move vue and vue-calendar-heatmap to webpack (#10188)
- unvendor vue and vue-calendar-heatmap
- remove unused moment.js leftover from previous heatmap version
- ensure webpack loads the full version of vue
- fix vue devmode warning related to 'searchLimit' type
I wanted to name the chunk heatmap.js but adblockers don't like that
filename [1].
[1] 3899d5dff3/easyprivacy/easyprivacy_general.txt (L2095)
- move "vendor" files to js/vendor and less/vendor
- move swagger to js/standalone (meant for standalone pages)
- move gitgraph to features and streamline its loading
- add linting configs to webpack dependencies in make
- set ignored files for eslint/stylelint directly in their configs
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: Antoine GIRARD <sapk@users.noreply.github.com>
this speeds up repeated webpack builds by around 20%. It will use the
default cache directory `node_modules/.cache/babel-loader`.
Also added cache invalidation to workaround https://github.com/babel/babel-loader/issues/690
- introduced window.config to help with js-based lazy-loading
- adjusted webpack chunk naming to avoid 'vendors~name.js' that webpack
defaults to for vendor chunks.
- added theme class to html and prefixed all selectors. this is
neccesary so that the theme styles win over the lazy-loaded ones.
Co-authored-by: zeripath <art27@cantab.net>
- added new 'make webpack' target
- deprecated 'make js' and 'make css'
- extend webpack config to load the less files
- updated docs
I had to rename the source file of `arc-green.less` to avoid generating
a useless JS entrypoint via webpack-fix-style-only-entries which would
not work with different source/destination filenames. I hear that there
should be cleaner solutions possible once we upgrade to Webpack 5.
Co-authored-by: zeripath <art27@cantab.net>
add css extraction and minification to webpack (#9944)
This changes the CSS output of webpack to output to the public/css
directory instead of inling CSS in JS. This enables CSS minification and
autoprefixer based on browserslist which would otherwise not be
possible.
The result of this change is two new output files currently:
- public/css/swagger.css
- public/css/gitgraph.css
Co-authored-by: techknowlogick <matti@mdranta.net>
move jquery and jquery-migrate to npm/webpack (#9813)
Currently, this needs to be its own chunk because fomantic depends
on jQuery being present. The next step is to move fomantic to webpack
too after which we can combine the index,fomantic and jquery files into
one.
jquery-migrate is still neccessary because our ancient version of Dropzone
seems to break without it. I imagine it can be removed after a Dropzone
upgrade.
Created a second webpack output file for swagger-ui which is loaded on
the /api/swagger route. One notable difference is the absence of the
swagger favicon that was previously used which is now the gitea icon. I
see no easy way to restore that favicon, so I decided to not keep it.
webpack polyfills did not work because useBuiltIns: 'entry' expects a
explicit core-js import. Changed it to 'usage' which does not require
these explicit imports and polyfills based on browserslist.
As a result, the built index.js now went from 128kB to 192kB.
Ref: https://babeljs.io/docs/en/babel-preset-env#usebuiltins
Co-authored-by: zeripath <art27@cantab.net>
- moved gitgraph.js to web_src and made it importable and es6-compatible
- created new webpack chunk for gitgraph
- enabled CSS loader in webpack
- enabled async/await syntax via regenerator-runtime
- added script to ensure webpack chunks are loaded correctly
- disable terser's comment extraction to prevent .LICENCE files
gitgraph.js has many issues:
1. it is incompatible with ES6 because of strict-mode violations
1. it does not export anything
1. it's css has weird styles like for `body`
1. it is not available on npm
I fixed points 1-3 in our version so it's now loadable in webpack. We should eventually consider alternatives.
* modernize js and use babel
- add babel toolchain to transform modern JS to ES5
- extend eslint config for modern rules
- fixes linting issues via `eslint --fix` and manual fixes
* run 'make css' to satisfy CI
* code style tweaks and set js indendation to 2 in .editorconfig
* regenerate js
Cirno the Strongest
silverwind
zeripath
John Olheiser
Lauris BH
Lunny Xiao