feat: 报告模板打包成一个html

This commit is contained in:
chenjianxing 2021-07-15 17:40:15 +08:00 committed by jianxing
parent 6124e904fd
commit 47b7f49e83
5 changed files with 106 additions and 3 deletions

View File

@ -71,6 +71,7 @@
"eslint": "^5.16.0", "eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0", "eslint-plugin-vue": "^5.0.0",
"file-writer": "^1.0.2", "file-writer": "^1.0.2",
"html-webpack-inline-source-plugin": "0.0.10",
"vue-template-compiler": "2.6.14" "vue-template-compiler": "2.6.14"
}, },
"eslintConfig": { "eslintConfig": {

View File

@ -0,0 +1,46 @@
<template>
<div>
{{test}}
<el-button type="primary" plain size="mini" @click="console.log('aaaa')">sdfds</el-button>
<ms-pie-chart/>
</div>
</template>
<script>
import MsPieChart from "../../../business/components/common/components/MsPieChart";
export default {
name: "ApiDocumentsPage",
components: {
MsPieChart
},
data() {
return {
test: 'testaaa'
}
},
props: {
},
created: function () {
},
watch: {
},
computed: {
},
methods: {
},
}
</script>
<style scoped>
</style>

View File

@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="shortcut icon" href="<%= BASE_URL %>favicon.ico">
<title>Test Plan Report</title>
</head>
<body>
<div id="planReport"></div>
</body>
</html>

View File

@ -0,0 +1,27 @@
import Vue from 'vue';
import ElementUI, {Button, Col, Form, FormItem, Input, Row} from 'element-ui';
import '@/assets/theme/index.css';
import '@/common/css/menu-header.css';
import '@/common/css/main.css';
import PlanReport from "./PlanReport.vue";
import i18n from "@/i18n/i18n";
import chart from "@/common/js/chart";
Vue.use(ElementUI, {
i18n: (key, value) => i18n.t(key, value)
});
Vue.use(Row);
Vue.use(Col);
Vue.use(Form);
Vue.use(FormItem);
Vue.use(Input);
Vue.use(Button);
Vue.use(chart);
new Vue({
el: '#planReport',
i18n,
render: h => h(PlanReport)
});

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin')
function resolve(dir) { function resolve(dir) {
return path.join(__dirname, dir); return path.join(__dirname, dir);
@ -31,7 +32,12 @@ module.exports = {
document: { document: {
entry: "src/document/document.js", entry: "src/document/document.js",
template: "src/document/document.html", template: "src/document/document.html",
filename: "document.html" filename: "document.html",
},
planReport: {
entry: "src/template/report/plan/plan-report.js",
template: "src/template/report/plan/plan-report.html",
filename: "plan-report.html",
} }
}, },
configureWebpack: { configureWebpack: {
@ -40,9 +46,19 @@ module.exports = {
alias: { alias: {
'@': resolve('src') '@': resolve('src')
} }
}
}, },
chainWebpack(config) { },
chainWebpack: config => {
// 报告模板打包成一个html
config.plugin('html-planReport')
.tap(args => {
args[0].inlineSource = '.(js|css)$';
return args;
});
config.plugin('inline-source-html-planReport')
.after('html-planReport')
.use(HtmlWebpackInlineSourcePlugin);
config.plugins.delete('prefetch'); config.plugins.delete('prefetch');
} }
}; };