瀏覽代碼

feat: build externals cdn assets
- clear old theme-color file

Sendya 5 年之前
父節點
當前提交
46436ee5e0
共有 3 個文件被更改,包括 34 次插入3460 次删除
  1. 0 3459
      public/color.less
  2. 8 0
      public/index.html
  3. 26 1
      vue.config.js

文件差異過大導致無法顯示
+ 0 - 3459
public/color.less


+ 8 - 0
public/index.html

@@ -7,6 +7,10 @@
     <link rel="icon" href="<%= BASE_URL %>logo.png">
     <title>Ant Design Pro</title>
     <style>#loading-mask{position:fixed;left:0;top:0;height:100%;width:100%;background:#fff;user-select:none;z-index:9999;overflow:hidden}.loading-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-100%)}.loading-dot{animation:antRotate 1.2s infinite linear;transform:rotate(45deg);position:relative;display:inline-block;font-size:64px;width:64px;height:64px;box-sizing:border-box}.loading-dot i{width:22px;height:22px;position:absolute;display:block;background-color:#1890ff;border-radius:100%;transform:scale(.75);transform-origin:50% 50%;opacity:.3;animation:antSpinMove 1s infinite linear alternate}.loading-dot i:nth-child(1){top:0;left:0}.loading-dot i:nth-child(2){top:0;right:0;-webkit-animation-delay:.4s;animation-delay:.4s}.loading-dot i:nth-child(3){right:0;bottom:0;-webkit-animation-delay:.8s;animation-delay:.8s}.loading-dot i:nth-child(4){bottom:0;left:0;-webkit-animation-delay:1.2s;animation-delay:1.2s}@keyframes antRotate{to{-webkit-transform:rotate(405deg);transform:rotate(405deg)}}@-webkit-keyframes antRotate{to{-webkit-transform:rotate(405deg);transform:rotate(405deg)}}@keyframes antSpinMove{to{opacity:1}}@-webkit-keyframes antSpinMove{to{opacity:1}}</style>
+    <!-- require cdn assets css -->
+    <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>
+    <link rel="stylesheet" href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" />
+    <% } %>
   </head>
   <body>
     <noscript>
@@ -19,6 +23,10 @@
           </div>
         </div>
     </div>
+    <!-- require cdn assets js -->
+    <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.js) { %>
+    <script type="text/javascript" src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
+    <% } %>
     <!-- built files will be auto injected -->
   </body>
 </html>

+ 26 - 1
vue.config.js

@@ -6,13 +6,32 @@ function resolve (dir) {
   return path.join(__dirname, dir)
 }
 
+const assetsCDN = {
+  css: [],
+  // https://unpkg.com/browse/vue@2.6.10/
+  js: [
+    '//unpkg.com/vue@2.6.10/dist/vue.min.js',
+    '//unpkg.com/vue-router@3.0.6/dist/vue-router.min.js',
+    '//unpkg.com/vuex@3.1.1/dist/vuex.min.js',
+    '//unpkg.com/axios@0.19.0/dist/axios.min.js'
+  ]
+}
+
 // vue.config.js
 const vueConfig = {
   configureWebpack: {
+    // webpack plugins
     plugins: [
       // Ignore all locale files of moment.js
       new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
-    ]
+    ],
+    // webpack build externals
+    externals: {
+      vue: 'Vue',
+      'vue-router': 'VueRouter',
+      vuex: 'Vuex',
+      axios: 'axios'
+    }
   },
 
   chainWebpack: (config) => {
@@ -34,6 +53,12 @@ const vueConfig = {
       .options({
         name: 'assets/[name].[hash:8].[ext]'
       })
+
+    // assets require on cdn
+    config.plugin('html').tap(args => {
+      args[0].cdn = assetsCDN
+      return args
+    })
   },
 
   css: {

部分文件因文件數量過多而無法顯示