gulpfile.js

@@ -14,6 +14,9 @@ var fileinclude = require("gulp-file-include");
 
 
 var babel = require('gulp-babel');
+var webpack = require('webpack-stream');
+var sourceMap = require('gulp-sourcemaps');
+var webpackConfig = require ("./webpack/webpack.config.js");
 // 创建
 gulp.task("connect", function () {
   connect.server({
@@ -23,8 +26,6 @@ gulp.task("connect", function () {
   });
 });
 
-
-
 gulp.task("fileinclude", function () {
   // 适配page中所有文件夹下的所有html，排除src下的tpl文件夹中html
   gulp
@@ -78,15 +79,18 @@ gulp.task("watchs", function () {
 });
 
 
-// 定义JavaScript转译任务
+
 gulp.task('script', () => {
-  return gulp.src('src/static/js/**/*.js') // 指定要转译的JavaScript文件夹
+  return gulp.src('src/static/js/*.js')
+  .pipe( sourceMap.init() )
   .pipe(babel({
-      presets: ['@babel/env'] // 使用Babel预设来转译ES6到ES5
+    presets: ['@babel/preset-env']
   }))
-    .pipe(gulp.dest('dist/static/js/')); // 输出转译后的文件到dist/static/js/文件夹
-});
- 
+  .pipe(webpack(webpackConfig))
+  .pipe(sourceMap.write()) 
+  .pipe(gulp.dest('dist/static/js/'))
+  .pipe(connect.reload()); //更新;
+  });
 
   gulp.task("lib", function () {
     return gulp

src/static/css/common.css

@@ -1,67 +1 @@
-@charset "UTF-8";
-/* 背景颜色 */
-/* 字体 */
-/*普通字体颜色*/
-/* 重置样式 */
-html {
-  font-family: sans-serif;
-  font-size: 14px;
-}
-
-body {
-  margin: 0;
-  padding: 0;
-}
-
-a:link, a:visited, a:hover, a:active {
-  text-decoration: none;
-  color: #5bbe8e;
-}
-
-/* 底部 */
-.footer-box {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  height: 30px;
-  background-color: #5bbe8e;
-}
-
-.footer-box .content {
-  font-size: 12px;
-  color: #fff;
-}
-
-/* 头部 */
-.header {
-  height: 40px;
-  line-height: 40px;
-  background-color: #fff;
-  color: #5bbe8e;
-  box-shadow: 0 4px 4px #f9f9fc;
-}
-.header .box {
-  display: flex;
-  justify-content: space-around;
-  align-items: center;
-  padding: 0 10%;
-}
-.header .box .logo {
-  font-size: 16px;
-}
-.header .box a:link, .header .box a:visited, .header .box a:hover, .header .box a:active {
-  color: #5bbe8e;
-}
-.header .opr-box {
-  display: flex;
-  align-items: center;
-  color: #5bbe8e;
-}
-.header .opr-box .item {
-  font-size: 16px;
-  margin-right: 10px;
-}
+@charset "UTF-8";html{font-size:14px;font-family:Source Han Sans CN}body{background-color:#f3dbd9;overflow:hidden}body,html{margin:0;padding:0;height:100%}a:active,a:hover,a:link,a:visited{text-decoration:none;color:#5bbe8e}.logo-box{height:33px;margin:20px}.logo-box>img{width:136px;height:32px}.btn-box,.xia-btn-box{height:47px;color:#FFF;line-height:2.5;position:fixed;right:0;margin:0 auto;left:0;cursor:pointer;font-family:Source Han Sans CN;font-weight:400}.btn-box{bottom:214px;width:237px;border-radius:5px;background:#E29A3C;border:4px solid rgba(226,154,60,.4);font-size:17px;text-align:center}.xia-btn-box{bottom:57px;width:237px;border-radius:5px;background:#E29A3C;border:4px solid rgba(226,154,60,.4);font-size:17px;text-align:center}.content{position:fixed;left:0;right:0;bottom:220px;margin:0 auto}.content .title{font-family:Source Han Sans CN;font-weight:400;font-size:16px;color:#333;width:100%;text-align:center;margin-bottom:14px}.content .form-box{width:342px;height:61px;background:#FFF;border-radius:7px;opacity:.6;margin:0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.form-box .form-item{width:120px;height:33px;background:#FDF1E3;border-radius:3px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0 14px;position:relative;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap}.form-item::after,.item-form-item::after{content:'▼';position:absolute;right:8px}.select-grp{position:relative;vertical-align:middle;display:inline-block}.select-grp:before{content:'\25bc';position:absolute;color:#767676;top:0;bottom:1px;right:0;width:2em;padding-top:.7em;line-height:inherit;text-align:center;-ms-transform:scale(.84,.42);transform:scale(.84,.42);-webkit-transform:scale(.84,.42)}.select-grp select{appearance:none;-webkit-appearance:none;-moz-appearance:none;width:100%;height:40px;padding-right:2em;padding-left:1em;border:none;cursor:pointer;background:#FDF1E3;border-radius:3px}select::-ms-expand{display:none}.model-content .model-item,.my-form-box{display:-webkit-box;display:-ms-flexbox}.model{position:fixed;top:0;left:0;bottom:0;right:0;z-index:1;background-color:rgba(0,0,0,.4)}.model-box{background-color:#fff;height:300px;position:absolute;bottom:0;left:0;right:0;overflow-y:auto;border-radius:25px 25px 0 0}.model-box .model-title{width:100%;font-size:18px;text-align:center;padding:20px 0}.model-content .model-item{height:48px;width:100%;text-align:center;font-size:14px;border-bottom:1px solid #F4F5F6;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer}.my-form-box{width:337px;height:84px;background:#FFF;border-radius:3px;opacity:.6;display:flex;margin:0 auto}.my-form-box .item-box{-ms-flex-preferred-size:50%;flex-basis:50%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding-left:8px;padding-top:8px}.my-form-box .item-box .item-title{font-family:Source Han Sans CN;font-weight:700;font-size:16px;color:#333;margin-bottom:10px}.my-form-box .item-box .input-form-item,.my-form-box .item-box .item-form-item{width:148px;height:33px;background:#FDF1E3;border-radius:3px;line-height:33px;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;text-indent:8px;position:relative}input{-webkit-box-flex:1;-ms-flex:1;flex:1;outline:0;color:#333;font-size:.9em;padding:.5em;border-radius:.2em;border:none;-webkit-appearance:none;background:#FDF1E3;text-indent:8px}input:focus,input:hover{border:none}.footer-box{width:341px;height:40px;background:#FDF1E3;border-radius:3px;opacity:.8;position:fixed;bottom:203px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.footer-box .footer-title{font-family:Source Han Sans CN;font-weight:400;font-size:15px;color:#E29A3C}.footer-ti-shi{width:17px;height:17px}

src/static/css/variable.css

@@ -1,4 +1 @@
 @charset "UTF-8";
-/* 背景颜色 */
-/* 字体 */
-/*普通字体颜色*/