feat: http服务启动配置

dashboard.html

@@ -4,7 +4,7 @@
         <meta charset="UTF-8" />
         <meta http-equiv="X-UA-Compatible" content="IE=edge" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" />
+        <!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" /> -->
         <title>看板列表</title>
         <script src="./js/tokenSetting.js"></script>
         <link rel="stylesheet" href="https://at.alicdn.com/t/font_2431045_hbwl3x53oep.css" />

dashboard/index.html

@@ -4,7 +4,7 @@
         <meta charset="UTF-8" />
         <meta http-equiv="X-UA-Compatible" content="IE=edge" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" />
+        <!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" /> -->
         <title>仪表盘配置</title>
         <script src="../js/tokenSetting.js"></script>
         <link rel="stylesheet" href="./global.css" />

gulpfile.js

@@ -3,7 +3,7 @@
  * @description: 使用gulp压缩文件
  * @Date: 2021-08-26 10:25:20
  * @LastEditors: 莫靓仔
- * @LastEditTime: 2021-09-03 16:47:23
+ * @LastEditTime: 2021-09-24 17:43:48
  */
 const OUTPUT = './dist'
 const fs = require('fs')
@@ -19,6 +19,7 @@ const babel = require('gulp-babel')
 const minifyCSS = require('gulp-minify-css')
 const imagemin = require('gulp-imagemin')
 const htmlmin = require('gulp-htmlmin')
+const connect = require('gulp-connect')
 
 // const through = require('through2')
 // const browserify = require('browserify')
@@ -40,7 +41,17 @@ const ignoreList = [
     path.resolve('./yarn-lock.lock')
 ]
 // 忽略函数这些关键字的文件
-const ignoreKeyword = ['jquery', 'min', 'layui', 'laydate', 'echarts.js', 'node_modules', 'vscode', 'moment', 'ecStat']
+const ignoreKeyword = [
+    'jquery',
+    'min',
+    'layui',
+    'laydate',
+    'echarts.js',
+    'node_modules',
+    'vscode',
+    'moment',
+    'ecStat'
+]
 
 // 获取所有文件路径
 const getSrcFile = () => {
@@ -87,7 +98,9 @@ const getSrcFile = () => {
                         fileClass.css.push(fileDir)
                     } else if (/\.html$/.test(file)) {
                         fileClass.html.push(fileDir)
-                    } else if (/\.(jpg|bmp|gif|ico|pcx|jpeg|tif|png|raw|tga)$/.test(file)) {
+                    } else if (
+                        /\.(jpg|bmp|gif|ico|pcx|jpeg|tif|png|raw|tga)$/.test(file)
+                    ) {
                         fileClass.image.push(fileDir)
                     } else {
                         // 其他的直接复制，不处理
@@ -108,7 +121,9 @@ const { js, css, html, image, others } = getSrcFile()
 const getOutputPath = filePath => {
     // 区分windows和mac
     let url = os.type() == 'Windows_NT' ? '\\' : '/'
-    let res = `${distPath}${allPath.substring(allPath.lastIndexOf(url))}${filePath.split(allPath)[1]}`
+    let res = `${distPath}${allPath.substring(allPath.lastIndexOf(url))}${
+        filePath.split(allPath)[1]
+    }`
     return res.slice(0, res.lastIndexOf(url))
 }
 
@@ -268,7 +283,36 @@ function cleanGulp(cb) {
     cb()
 }
 
+//使用connect启动一个Web服务器
+gulp.task('connect', function () {
+    connect.server({
+        root: './',
+        port: 8083,
+        livereload: true,
+        host:'::'
+    })
+})
+
+function watchJs() {
+    return gulp.watch(['/js/*.js'])
+}
+function watchCss() {
+    return gulp.watch(['/css/*.css'])
+}
+function watchHtml() {
+    return gulp.watch(['/*.html'])
+}
+gulp.task('watch', function () {
+    //livereload.listen();
+    gulp.parallel(watchJs, watchCss, watchHtml)
+})
+
+gulp.task('dev', gulp.parallel('connect', 'watch'))
+
 // series 串行执行所有任务
 // parallel 并行执行所有任务
 // 先删除dist文件夹，在执行打包任务（所有打包任务一起执行）
-exports.default = gulp.series(cleanGulp, gulp.parallel(jsGulp, cssGulp, htmlGulp, imageGulp, copyGulp))
+exports.default = gulp.series(
+    cleanGulp,
+    gulp.parallel(jsGulp, cssGulp, htmlGulp, imageGulp, copyGulp)
+)

index.html

@@ -5,7 +5,7 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
+    <!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> -->
     <title>BI系统</title>
     <script src="./js/watcher.js"></script>
     <script src="./js/domainSetting.js"></script>

package.json

@@ -46,6 +46,7 @@
     "del": "^6.0.0",
     "gulp": "^4.0.2",
     "gulp-babel": "^8.0.0",
+    "gulp-connect": "^5.7.0",
     "gulp-imagemin": "5.0.1",
     "jszip": "^3.7.1",
     "scp2": "0.5.0",

webpack.config.js

@@ -3,9 +3,10 @@
  * @description: 本地run的webpack配置
  * @Date: 2021-08-19 17:10:54
  * @LastEditors: 莫靓仔
- * @LastEditTime: 2021-09-14 19:14:30
+ * @LastEditTime: 2021-09-24 18:00:04
  */
-var path = require('path')
+const path = require('path')
+// const webpack = require('webpack')
 module.exports = {
     // 入口
     entry: {
@@ -24,15 +25,18 @@ module.exports = {
         filename: 'js/[name]/[name]-bundle.js'
     },
     mode: 'development',
+    // plugins: [new webpack.HotModuleReplacementPlugin()],
     devServer: {
         open: true,
+        // hot: true,
         // 端口号
-        port: 5501,
+        port: 8002,
+        host: '192.168.1.108', // 本机ip
         // 是否压缩
         compress: true,
         // 当前目录
-        contentBase: path.join(__dirname, './'),
+        contentBase: path.join(__dirname, '/'),
         // dev启动时候打开指定页面
-        openPage: './index.html'
+        openPage: './dashboard.html'
     }
 }