finn/forgejo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Frontend refactor: move Vue related code from index.js to components dir, and remove unused codes. (#17301)

Browse source 
* frontend refactor

* Apply suggestions from code review

Co-authored-by: delvh <dev.lh@web.de>

* Update templates/base/head.tmpl

Co-authored-by: delvh <dev.lh@web.de>

* Update docs/content/doc/developers/guidelines-frontend.md

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>

* fix typo

* fix typo

* refactor PageData to pageData

* Apply suggestions from code review

Co-authored-by: delvh <dev.lh@web.de>

* Simply for the visual difference.

Co-authored-by: delvh <dev.lh@web.de>

* Revert "Apply suggestions from code review"

This reverts commit 4d78ad9b0e96ca180e0823de17659a2e0814c099.

Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: 6543 <6543@obermui.de>
This commit is contained in:
wxiaoguang 2021-10-15 10:35:26 +08:00 • committed by GitHub
parent 96ff3e310f
commit 56362043d3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 718 additions and 634 deletions
Download patch file Download diff file Expand all files Collapse all files

52
web_src/js/components/VueComponentLoader.js Normal file
View file

@ -0,0 +1,52 @@
import Vue from 'vue';
import {svgs} from '../svg.js';
const vueDelimiters = ['${', '}'];
let vueEnvInited = false;
function initVueEnv() {
if (vueEnvInited) return;
vueEnvInited = true;
const isProd = window.config.IsProd;
Vue.config.productionTip = false;
Vue.config.devtools = !isProd;
}
let vueSvgInited = false;
function initVueSvg() {
if (vueSvgInited) return;
vueSvgInited = true;
// register svg icon vue components, e.g. <octicon-repo size="16"/>
for (const [name, htmlString] of Object.entries(svgs)) {
const template = htmlString
.replace(/height="[0-9]+"/, 'v-bind:height="size"')
.replace(/width="[0-9]+"/, 'v-bind:width="size"');
Vue.component(name, {
props: {
size: {
type: String,
default: '16',
},
},
template,
});
}
}
function initVueApp(el, opts = {}) {
if (typeof el === 'string') {
el = document.querySelector(el);
}
if (!el) return null;
return new Vue(Object.assign({
el,
delimiters: vueDelimiters,
}, opts));
}
export {vueDelimiters, initVueEnv, initVueSvg, initVueApp};