first commit

tsvue/build/.pydio

@@ -0,0 +1 @@
+a6b359f5-33a6-4d08-90b1-2ac337507262

tsvue/build/dev.js

@@ -0,0 +1,72 @@
+const path = require('path');
+const VariableConfig = require('./variable');
+
+/**
+ * 开发阶段的一些基础配置
+ */
+class DevConfig {
+  constructor(chainWebpack) {
+    this.chainWebpack = chainWebpack;
+    this.pubSetting();
+  }
+
+  pubSetting() {
+
+    /**
+     * 移除不必要的 prefetch 和 preload请求
+     */
+    this.chainWebpack.plugins.delete('prefetch');
+    this.chainWebpack.plugins.delete('preload');
+
+    /**
+     * html 模板引擎 pug 配置
+     */
+    this.chainWebpack.module.rule('pug')
+      .test(/\.pug$/)
+      .use('pug-html-loader')
+      .loader('pug-html-loader')
+      .end();
+
+    this.chainWebpack.module
+      .rule('images')
+      .use('url-loader')
+      .loader('url-loader')
+      .tap(options => Object.assign(options, { limit: 10240 }));
+
+    /**
+     * 导入全局css
+     * @type {*[]}
+     */
+    const types = ['vue-modules', 'vue', 'normal-modules', 'normal'];
+    types.forEach(type => this.addStyleResource(this.chainWebpack.module.rule('less').oneOf(type)));
+
+    /**
+     * 配置路径别名，项目中引用资源的时候路径可以更简短
+     * 但是ts文件在用的时候，编译器会报错，需要添加 @ts-ignore
+     * 忽略开发工具的错误。
+     */
+    this.chainWebpack.resolve.alias
+      .set('@public', this.resolve(VariableConfig.PublicConfig.alias.public))
+      .set('@core', this.resolve(VariableConfig.PublicConfig.alias.core))
+      .set('@', this.resolve(VariableConfig.PublicConfig.alias.root))
+      .set('@assets', this.resolve(VariableConfig.PublicConfig.alias.assets))
+      .set('@less', this.resolve(VariableConfig.PublicConfig.alias.less))
+      .set('@impl', this.resolve(VariableConfig.PublicConfig.alias.impl))
+  }
+
+  addStyleResource(rule) {
+    rule.use('style-resource')
+      .loader('style-resources-loader')
+      .options({
+        patterns: [
+          path.resolve(__dirname, VariableConfig.PublicConfig.alias.globalStyl)
+        ],
+      });
+  }
+
+  resolve(dir) {
+    return path.join(__dirname, dir);
+  }
+}
+
+module.exports = DevConfig;

tsvue/build/prod.js

@@ -0,0 +1,72 @@
+const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
+const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
+const CompressionPlugin = require('compression-webpack-plugin');
+const VariableConfig = require('./variable');
+
+/**
+ * 正式阶段的一些配置
+ */
+class ProdConfig {
+
+  constructor(configureWebpack) {
+    this.configureWebpack = configureWebpack
+
+    this.RemoveCommonPackage();
+    this.CompressedCode();
+    this.GzipCompressedCode();
+  }
+
+  /**
+   * 去除这些公共包，让webpack不打包到项目源码的js中，减小项目js体积
+   * 然后使用cdn 数组里面的资源外链来引入。
+   */
+  RemoveCommonPackage() {
+    this.configureWebpack.externals = {
+      'vue': 'Vue',
+      'vue-router': 'VueRouter',
+      'axios': 'axios',
+    };
+  }
+
+  /**
+   * 部署阶段 代码压缩
+   */
+  CompressedCode() {
+    this.configureWebpack.plugins.push(
+      // 生产环境自动删除 console，如果需要显示 console 请修改
+      // drop_console 为 false
+      new UglifyJsPlugin({
+        uglifyOptions: {
+          compress: {
+            warnings: false,
+            drop_debugger: true,
+            drop_console: true,
+          },
+        },
+        sourceMap: false,
+        parallel: true,
+      }),
+    );
+  }
+
+  /**
+   * Gzip压缩，开启 BundleAnalyzerPlugin（分析打包后的js文件体积）
+   */
+  GzipCompressedCode() {
+    this.configureWebpack.mode = 'production';
+    return {
+      plugins: [
+        new CompressionPlugin({
+          test: /\.js$|\.html$|\.css/, //匹配文件名
+          threshold: 10240,            //对超过10k的数据进行压缩
+          deleteOriginalAssets: false  //是否删除原文件
+        }),
+        new BundleAnalyzerPlugin(),
+      ]
+    }
+  }
+
+
+}
+
+module.exports = ProdConfig;

tsvue/build/variable.js

@@ -0,0 +1,25 @@
+// 基础变量配置
+module.exports = {
+   PublicConfig: {
+     // 入口
+     entry: './src/core/run/index.run.ts',
+     // 别名
+     alias: {
+       public: '../public',
+       core: '../src/core',
+       impl: '../src/core/service/impl',
+       root: '../src/application',
+       assets: '../src/application/assets',
+       less: '../src/application/assets/less/components',
+       globalStyl: '../src/application/assets/less/imports.less'
+     }
+   },
+   cdn: {
+     css: [],
+     js: [
+       'https://cdn.bootcss.com/vue/2.6.11/vue.runtime.min.js',
+       'https://cdn.bootcss.com/vue-router/3.1.3/vue-router.min.js',
+       'https://cdn.bootcss.com/axios/0.19.2/axios.min.js',
+     ]
+   }
+ };

tsvue/build/zip

@@ -0,0 +1,4 @@
+#!/usr/bin/env node
+require('compressing').zip.compressDir('dist/', 'dist.zip')
+  .then(() => console.log('zip Success'))
+  .catch(err => console.error(err));