研发图纸文件管理系统-前端项目
guoranred
2020-09-15 4c7c5c1da1501814fbc07504199168878f743dc2
add cdn assets
2个文件已修改
52 ■■■■■ 已修改文件
public/index.html 8 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
vue.config.js 44 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
public/index.html
@@ -6,12 +6,20 @@
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
    <!-- 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 class="beauty-scroll">
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></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>
vue.config.js
@@ -2,6 +2,33 @@
const ThemeColorReplacer = require('webpack-theme-color-replacer')
const {getThemeColors, modifyVars} = require('./src/utils/themeUtil')
const {resolveCss} = require('./src/utils/theme-color-replacer-extend')
const isProd = process.env.NODE_ENV === 'production'
const assetsCDN = {
  // webpack build externals
  externals: {
    vue: 'Vue',
    'vue-router': 'VueRouter',
    vuex: 'Vuex',
    axios: 'axios',
    nprogress: 'NProgress',
    clipboard: 'ClipboardJS',
    '@antv/data-set': 'DataSet'
  },
  css: [
  ],
  js: [
    '//cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js',
    '//cdn.jsdelivr.net/npm/vue-router@3.3.4/dist/vue-router.min.js',
    '//cdn.jsdelivr.net/npm/vuex@3.4.0/dist/vuex.min.js',
    '//cdn.jsdelivr.net/npm/axios@0.19.2/dist/axios.min.js',
    '//cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.min.js',
    '//cdn.jsdelivr.net/npm/clipboard@2.0.6/dist/clipboard.min.js',
    '//cdn.jsdelivr.net/npm/@antv/data-set@0.11.4/build/data-set.min.js'
  ]
}
module.exports = {
  devServer: {
    // proxy: {
@@ -30,15 +57,28 @@
        resolveCss
      })
    )
    config.externals = isProd ? assetsCDN.externals : {}
  },
  chainWebpack: config => {
    // 生产环境下关闭css压缩的 colormin 项,因为此项优化与主题色替换功能冲突
    if (process.env.NODE_ENV === 'production') {
    if (isProd) {
      config.plugin('optimize-css')
        .tap(args => {
            args[0].cssnanoOptions.preset[1].colormin = false
          return args
        })
    }
    config.plugin('html')
      .tap(args => {
        args[0].title = 'Vue Antd Admin'
      return args
    })
    if (isProd) {
      config.plugin('html')
        .tap(args => {
          args[0].cdn = assetsCDN
        return args
      })
    }
  },
  css: {
@@ -51,7 +91,7 @@
      }
    }
  },
  publicPath: process.env.NODE_ENV === 'production' ? '/vue-antd-admin/' : '/',
  publicPath: isProd ? '/vue-antd-admin/' : '/',
  outputDir: 'dist',
  assetsDir: 'static',
  productionSourceMap: false