webpack: scss, vue (#189)

WebPack에 scss와 vue를 사용할 수 있도록 세팅.

현재는 php서버와 코드가 강하게 엮여있기 때문에 vue-cli 대신 수동으로 webpack에 등록.

파일 번들링 경로는 다음과 같음

- scss + style -> css
- ts -> js

Reviewed-on: https://storage.hided.net/gitea/devsam/core/pulls/189
Co-authored-by: hide_d <hided62@gmail.com>
Co-committed-by: hide_d <hided62@gmail.com>
This commit is contained in:
2021-08-14 05:47:16 +09:00
parent 96faa924d8
commit 56daf15c8e
12 changed files with 153 additions and 34 deletions
+6 -2
View File
@@ -43,6 +43,8 @@ foreach(array_keys(General::INHERITANCE_KEY) as $key){
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=1024" />
<?= WebUtil::preloadCSS('css/inheritPoint.css') ?>
<?= WebUtil::preloadJS('js/inheritPoint.js') ?>
<?= WebUtil::printCSS('../e_lib/bootstrap.min.css') ?>
<?= WebUtil::printCSS('../d_shared/common.css') ?>
<?= WebUtil::printCSS('../css/config.css') ?>
@@ -52,14 +54,13 @@ foreach(array_keys(General::INHERITANCE_KEY) as $key){
<?= WebUtil::printJS('../e_lib/jquery-3.3.1.min.js') ?>
<?= WebUtil::printJS('../e_lib/bootstrap.bundle.min.js') ?>
<?= WebUtil::printJS('js/common.js') ?>
<?= WebUtil::printJS('js/inheritPoint.js') ?>
<script>
var items = <?=Json::encode($items)?>;
var helpText = <?=Json::encode($pointHelpText)?>;
</script>
</head>
<body onload="formStart()">
<body>
<table style='width:1000px;margin:auto;' class='tb_layout bg0'>
<tr>
@@ -126,6 +127,9 @@ foreach(array_keys(General::INHERITANCE_KEY) as $key){
<?php endforeach; ?>
</div>
</div>
<div id="app"></div>
<?= WebUtil::printJS('js/inheritPoint.js') ?>
</body>
</html>
+2 -22
View File
@@ -1,23 +1,3 @@
#inheritance_list{
display: flex;
flex-wrap: wrap;
}
#inheritance_list{display:flex;flex-wrap:wrap}.inherit_padding{width:33%;padding:10px 2px}.inherit_item{width:33%;padding:10px 2px}.col-form-label{text-align:right;padding-right:2ch}.inherit_value{text-align:right}
.inherit_padding{
width: 33%;
padding: 10px 2px;
}
.inherit_item{
width: 33%;
padding: 10px 2px;
}
.col-form-label{
text-align:right;
padding-right:2ch;
}
.inherit_value{
text-align: right;
}
/*# sourceMappingURL=inheritPoint.css.map*/
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"../css/inheritPoint.css","mappings":"AAAA,kBACI,aACA,eAGJ,iBACI,UACA,iBAGJ,cACI,UACA,iBAGJ,gBACI,iBACA,kBAGJ,eACI,iB","sources":["webpack://hidche_lib/./hwe/scss/inheritPoint.scss"],"sourcesContent":["#inheritance_list{\n display: flex;\n flex-wrap: wrap;\n}\n\n.inherit_padding{\n width: 33%;\n padding: 10px 2px;\n}\n\n.inherit_item{\n width: 33%;\n padding: 10px 2px;\n}\n\n.col-form-label{\n text-align:right;\n padding-right:2ch;\n}\n\n.inherit_value{\n text-align: right;\n}"],"names":[],"sourceRoot":""}
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+23
View File
@@ -0,0 +1,23 @@
#inheritance_list{
display: flex;
flex-wrap: wrap;
}
.inherit_padding{
width: 33%;
padding: 10px 2px;
}
.inherit_item{
width: 33%;
padding: 10px 2px;
}
.col-form-label{
text-align:right;
padding-right:2ch;
}
.inherit_value{
text-align: right;
}
+3 -1
View File
@@ -1,3 +1,5 @@
import "../scss/inheritPoint.scss";
import { sum } from "lodash";
import { unwrap } from "./util";
declare global {
@@ -35,4 +37,4 @@ function formStart() {
}
}
window.formStart = formStart;
formStart();
+6
View File
@@ -0,0 +1,6 @@
/* eslint-disable */
declare module '*.vue' {
import type { DefineComponent } from 'vue'
const component: DefineComponent<{}, {}, any>
export default component
}