public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(angular): fix up plugin for dev and prod, inline for prod builds

Browse Source
This commit is contained in:
Jack Westbrook
2025-03-03 09:40:33 +01:00
parent a5a024610c
commit 03960b45f8
2 changed files with 40 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/app/angular/partials.ts
+26 -26
View File
@@ -1,29 +1,29 @@
// TODO: Vite has no require.context support so we're importing them individually here.
// See the vite.config.ts angularHtmlImport plugin for the code that compiles these templates.
import 'app/angular/panel/partials/query_editor_row.html';
import 'app/angular/partials/http_settings_next.html';
import 'app/angular/partials/tls_auth_settings.html';
import 'app/features/admin/partials/admin_home.html';
import 'app/features/admin/partials/edit_org.html';
import 'app/features/admin/partials/stats.html';
import 'app/features/admin/partials/styleguide.html';
import 'app/features/alerting/partials/alert_tab.html';
import 'app/features/annotations/partials/event_editor.html';
import 'app/partials/confirm_modal.html';
import 'app/partials/modal.html';
import 'app/partials/reset_password.html';
import 'app/partials/signup_invited.html';
import 'app/plugins/panel/graph/axes_editor.html';
import 'app/plugins/panel/graph/tab_display.html';
import 'app/plugins/panel/graph/tab_legend.html';
import 'app/plugins/panel/graph/tab_series_overrides.html';
import 'app/plugins/panel/graph/tab_thresholds.html';
import 'app/plugins/panel/graph/tab_time_regions.html';
import 'app/plugins/panel/graph/thresholds_form.html';
import 'app/plugins/panel/graph/time_regions_form.html';
import 'app/plugins/panel/heatmap/partials/axes_editor.html';
import 'app/plugins/panel/heatmap/partials/display_editor.html';
import 'app/plugins/panel/table-old/column_options.html';
import 'app/plugins/panel/table-old/editor.html';
import 'app/plugins/panel/table-old/module.html';
import 'app/angular/panel/partials/query_editor_row.html?inline';
import 'app/angular/partials/http_settings_next.html?inline';
import 'app/angular/partials/tls_auth_settings.html?inline';
import 'app/features/admin/partials/admin_home.html?inline';
import 'app/features/admin/partials/edit_org.html?inline';
import 'app/features/admin/partials/stats.html?inline';
import 'app/features/admin/partials/styleguide.html?inline';
import 'app/features/alerting/partials/alert_tab.html?inline';
import 'app/features/annotations/partials/event_editor.html?inline';
import 'app/partials/confirm_modal.html?inline';
import 'app/partials/modal.html?inline';
import 'app/partials/reset_password.html?inline';
import 'app/partials/signup_invited.html?inline';
import 'app/plugins/panel/graph/axes_editor.html?inline';
import 'app/plugins/panel/graph/tab_display.html?inline';
import 'app/plugins/panel/graph/tab_legend.html?inline';
import 'app/plugins/panel/graph/tab_series_overrides.html?inline';
import 'app/plugins/panel/graph/tab_thresholds.html?inline';
import 'app/plugins/panel/graph/tab_time_regions.html?inline';
import 'app/plugins/panel/graph/thresholds_form.html?inline';
import 'app/plugins/panel/graph/time_regions_form.html?inline';
import 'app/plugins/panel/heatmap/partials/axes_editor.html?inline';
import 'app/plugins/panel/heatmap/partials/display_editor.html?inline';
import 'app/plugins/panel/table-old/column_options.html?inline';
import 'app/plugins/panel/table-old/editor.html?inline';
import 'app/plugins/panel/table-old/module.html?inline';
vite.config.ts
+14 -18
View File
@@ -65,32 +65,28 @@ export default defineConfig({
},
});
// This is a Vite plugin for handling angular templates.
// https://vitejs.dev/guide/api-plugin.html#simple-examples
/**
This is a Vite plugin for handling angular templates.
https://vitejs.dev/guide/api-plugin.html#simple-examples
// The webpack output from https://github.com/WearyMonkey/ngtemplate-loader looks like this:
// var code = "\n<div class=\"graph-annotation\">\n\t<div class=\"graph-annotation__header\">\n\t\t</div></div>\n";
// Exports
// var _module_exports =code;;
// var path = 'public/app/features/annotations/partials/event_editor.html';
// window.angular.module('ng').run(['$templateCache', function(c) { c.put(path, _module_exports) }]);
// module.exports = path;
// const htmlComponentFile = /\.html\?inline$/;
The webpack output from https://github.com/WearyMonkey/ngtemplate-loader looks like this:
var code = "\n<div class=\"graph-annotation\">\n\t<div class=\"graph-annotation__header\">\n\t\t</div></div>\n";
Exports
var _module_exports =code;;
var path = 'public/app/features/annotations/partials/event_editor.html';
window.angular.module('ng').run(['$templateCache', function(c) { c.put(path, _module_exports) }]);
module.exports = path;
*/
function angularHtmlImport() {
let isDevelopment = true;
const htmlComponentFile = /\.html\?inline$/;
return {
name: 'transform-angular-html',
configResolved(config) {
isDevelopment = config.command === 'serve';
},
async transform(src, id) {
if (id.endsWith('.html')) {
if (htmlComponentFile.test(id)) {
const idParts = id.split('/public/');
const path = idParts[idParts.length - 1];
// const minifysrc = await minify(src, minifierOptions);
const html = isDevelopment ? JSON.stringify(src) : src;
const html = JSON.stringify(src);
const result = `const path = 'public/${path}';
const htmlTemplate = ${html};
angular.module('ng').run(['$templateCache', c => { c.put(path, htmlTemplate) }]); export default path;`;