Reorganize frontend files and tooling (#10168)

- 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>

.eslintignore

@@ -1 +0,0 @@
-/web_src/js/semanticDropdown.js

.eslintrc

@@ -4,6 +4,9 @@ extends:
   - eslint-config-airbnb-base
   - eslint:recommended
 
+ignorePatterns:
+ - /web_src/js/vendor
+
 parserOptions:
   ecmaVersion: 2020
 

.stylelintrc

@@ -1,6 +1,10 @@
 extends: stylelint-config-standard
 
+ignoreFiles:
+  - web_src/less/vendor/**/*
+
 rules:
+  at-rule-empty-line-before: null
   block-closing-brace-empty-line-before: null
   color-hex-length: null
   comment-empty-line-before: null

Makefile

@@ -56,7 +56,8 @@ LDFLAGS := $(LDFLAGS) -X "main.MakeVersion=$(MAKE_VERSION)" -X "main.Version=$(G
 PACKAGES ?= $(filter-out code.gitea.io/gitea/integrations/migration-test,$(filter-out code.gitea.io/gitea/integrations,$(shell GO111MODULE=on $(GO) list -mod=vendor ./... | grep -v /vendor/)))
 
 GO_SOURCES ?= $(shell find . -name "*.go" -type f)
-WEBPACK_SOURCES ?= $(shell find web_src/js web_src/css web_src/less -type f)
+WEBPACK_SOURCES ?= $(shell find web_src/js web_src/less -type f)
+WEBPACK_CONFIGS := webpack.config.js .eslintrc .stylelintrc
 
 WEBPACK_DEST := public/js/index.js public/css/index.css
 BINDATA_DEST := modules/public/bindata.go modules/options/bindata.go modules/templates/bindata.go
@@ -517,7 +518,7 @@ $(FOMANTIC_EVIDENCE): semantic.json $(FOMANTIC_SOURCES) | node_modules
 .PHONY: webpack
 webpack: node-check $(WEBPACK_DEST)
 
-$(WEBPACK_DEST): $(WEBPACK_SOURCES) webpack.config.js | node_modules
+$(WEBPACK_DEST): $(WEBPACK_SOURCES) $(WEBPACK_CONFIGS) | node_modules
 	npx eslint web_src/js webpack.config.js
 	npx stylelint web_src/less
 	npx webpack --hide-modules --display-entrypoints=false

web_src/js/gitGraphLoader.js → web_src/js/features/gitGraph.js

@@ -1,8 +1,8 @@
-$(async () => {
+export default async function initGitGraph() {
   const graphCanvas = document.getElementById('graph-canvas');
   if (!graphCanvas) return;
 
-  const { default: gitGraph } = await import(/* webpackChunkName: "gitgraph" */'./gitGraph.js');
+  const { default: gitGraph } = await import(/* webpackChunkName: "gitgraph" */'../vendor/gitGraph.js');
 
   const graphList = [];
   $('#graph-raw-list li span.node-relation').each(function () {
@@ -10,4 +10,4 @@ $(async () => {
   });
 
   gitGraph(graphCanvas, graphList);
-});
+}

web_src/js/index.js

@@ -5,10 +5,11 @@
 import 'jquery.are-you-sure';
 import './publicPath.js';
 import './polyfills.js';
-import './gitGraphLoader.js';
-import './semanticDropdown.js';
+import './vendor/semanticDropdown.js';
+
 import initContextPopups from './features/contextPopup.js';
 import initHighlight from './features/highlight.js';
+import initGitGraph from './features/gitGraph.js';
 
 import ActivityTopAuthors from './components/ActivityTopAuthors.vue';
 
@@ -2578,6 +2579,7 @@ $(document).ready(async () => {
   initRepoStatusChecker();
   initTemplateSearch();
   initContextPopups(suburl);
+  initGitGraph();
 
   // Repo clone url.
   if ($('#repo-clone-url').length > 0) {

web_src/less/index.less

@@ -1,3 +1,6 @@
+@import "~highlight.js/styles/github.css";
+@import "./vendor/gitGraph.css";
+
 @import "_tribute";
 @import "_emojify";
 @import "_base";
@@ -13,5 +16,3 @@
 @import "_admin";
 @import "_explore";
 @import "_review";
-@import "~highlight.js/styles/github.css";
-@import "../css/gitGraph.css";

webpack.config.js

@@ -24,7 +24,7 @@ module.exports = {
       resolve(__dirname, 'web_src/less/index.less'),
     ],
     swagger: [
-      resolve(__dirname, 'web_src/js/swagger.js'),
+      resolve(__dirname, 'web_src/js/standalone/swagger.js'),
     ],
     jquery: [
       resolve(__dirname, 'web_src/js/jquery.js'),