update build tools

Author: Shawn Wang

build/run/dev-server.js

@@ -1,10 +1,15 @@
 const { exec } = require('child_process')
+const chalk = require('chalk')
 const path = require('path')
 const projectPath = __dirname.replace(`build${path.sep}run`, '')
 let port = process.env.port || 9000
+const webpackDevServerPath = path.join(projectPath, 'node_modules/.bin/webpack-dev-server')
+const webpackConfigPath = path.join(projectPath, 'build/webpack.config.js')
 
 function run () {
-    const child = exec(`${projectPath}node_modules/.bin/webpack-dev-server --config ${projectPath}build/webpack.config.js --color`, {
+    const buildCommand = `${webpackDevServerPath} --config ${webpackConfigPath} --color`
+    console.log(chalk.blue(buildCommand))
+    const child = exec(buildCommand, {
         env: {
             port,
         },

build/run/production.js

@@ -1,10 +1,21 @@
-const { exec, execSync } = require('child_process')
+const { exec } = require('child_process')
 const path = require('path')
+const fs = require('fs')
+const fsUtils = require('nodejs-fs-utils')
+const chalk = require('chalk')
 const projectPath = __dirname.replace(`build${path.sep}run`, '')
+const distDirPath = path.join(projectPath, 'dist')
+const webpackPath = path.join(projectPath, 'node_modules/.bin/webpack')
+const webpackConfigPath = path.join(projectPath, 'build/webpack.config.js')
 
 function run () {
-    execSync('rm -rf dist/*')
-    const child = exec(`${projectPath}node_modules/.bin/webpack --config ${projectPath}build/webpack.config.js`, (error, stdout, stderr) => {
+    console.log(chalk.red(`remove dir: ${distDirPath}`))
+    fsUtils.removeSync(distDirPath, {
+        skipErrors: true, fs,
+    })
+    const buildCommand = `${webpackPath} --config ${webpackConfigPath}`
+    console.log(chalk.blue(buildCommand))
+    const child = exec(buildCommand, (error, stdout, stderr) => {
         if (error) {
             console.error(error.message)
         }

build/webpack-config/dev-server.js

@@ -4,8 +4,8 @@ const { devServerConfig } = require(`${projectPath}package.json`)
 
 module.exports = {
     watchContentBase: true,
-    useLocalIp: true,
-    open: true,
+    useLocalIp: false,
+    open: false,
     clientLogLevel: 'warning',
     openPage: 'index.html',
     host: '0.0.0.0',

build/webpack-config/module.js

@@ -6,11 +6,6 @@ const { webpackConfig } = require(`${projectPath}package.json`)
 
 module.exports = {
     rules: [
-        {
-            test: /\.(ico)$/,
-            loader: 'url-loader',
-            options: { name: 'config/images/[name].[ext]' }
-        },
         {
             test: /\.(png|svg|jpg|gif)$/, use: [ {
                 loader: 'file-loader',
@@ -38,14 +33,20 @@ module.exports = {
         },
         {
             test: /\.js$/,
-            exclude: (resource) => {
-                if (/node_modules/.test(resource)) {
-                    const excludeRegArray = webpackConfig.transpileModules
-                    for (let i = 0; i < excludeRegArray.length; i++) {
-                        return !resource.includes(excludeRegArray[ i ])
+            exclude: (resourcePath) => {
+                const transplieRegArray = [ ...webpackConfig.transpileModules ]
+                if (/\Wnode_modules\W/.test(resourcePath)) {
+                    for (let i = 0, len = transplieRegArray.length; i < len; i++) {
+                        const transplieItem = transplieRegArray[ i ]
+                        if (typeof transplieItem === 'string') {
+                            return !resourcePath.includes(transplieItem)
+                        } else if (typeof transplieItem === 'object') {
+                            return !transplieItem.test(resourcePath)
+                        }
                     }
                     return true
                 }
+                return false
             },
             use: [ 'babel-loader' ]
         },

build/webpack-config/plugins.js

@@ -2,6 +2,7 @@ const path = require('path')
 const os = require('os')
 const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
+const webpack = require('webpack')
 const VueLoaderPlugin = require('vue-loader/lib/plugin')
 const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const FriendlyErrorsWebpackPlugin = require('friendly-errors-webpack-plugin')
@@ -38,6 +39,13 @@ const plugins = [
         },
         clearConsole: true,
     }),
+    new webpack.IgnorePlugin({
+        checkResource: (resourcePath) => {
+            if (/moment\/locale\/(?!zh-cn)/.test(resourcePath)){
+                return true
+            }
+        },
+    }),
     new VueLoaderPlugin(),
     new MiniCssExtractPlugin({
         filename: 'css/[name].[hash].css',

package.json

@@ -35,21 +35,23 @@
     },
     "devDependencies": {
         "@babel/core": "^7.4.4",
+        "@babel/polyfill": "^7.4.4",
         "@babel/preset-env": "^7.4.4",
         "@types/core-js": "^2.5.0",
         "@types/node": "^11.13.8",
         "autoprefixer": "^9.5.1",
         "babel-loader": "^8.0.5",
+        "chalk": "^4.0.0",
         "cross-env": "^5.2.0",
         "css-loader": "^2.1.1",
         "cssnano": "^4.1.10",
-        "es3ify-loader": "^0.2.0",
         "extract-text-webpack-plugin": "4.0.0-beta.0",
         "file-loader": "^3.0.1",
         "friendly-errors-webpack-plugin": "^1.7.0",
         "html-webpack-plugin": "^3.2.0",
         "mini-css-extract-plugin": "^0.6.0",
-        "node-sass": "^4.12.0",
+        "node-sass": "^4.13.1",
+        "nodejs-fs-utils": "^1.2.4",
         "optimize-css-assets-webpack-plugin": "^5.0.1",
         "postcss-loader": "^3.0.0",
         "sass": "^1.19.0",
@@ -63,7 +65,7 @@
         "webpack": "^4.30.0",
         "webpack-bundle-analyzer": "^3.3.2",
         "webpack-cli": "^3.3.0",
-        "webpack-dev-server": "^3.3.1"
+        "webpack-dev-server": "^3.8.0"
     },
     "license": "MIT"
 }

src/utils/date/index.ts

@@ -1,5 +1,5 @@
 export class DateUtils {
-    static showCountdownAccurateToDate (timeStr: string) {
+    static getCountdownStr(timeStr: string) {
         const TOTAL_TIME_FOR_SECOND = 1000
         const TOTAL_TIME_FOR_MINUTE = TOTAL_TIME_FOR_SECOND * 60
         const TOTAL_TIME_FOR_HOUR = TOTAL_TIME_FOR_MINUTE * 60