Inicio Explorar Ayuda
Registro Iniciar sesión
luyanan
/
back-conference
Vigilar 1
Destacar 0
Fork 0
Código Incidencias 0 Pull Requests 0 Commits 15 Releases 0 Wiki
Explorar el Código

Cdn地址可配, 待优化

daxiong.yang %!s(int64=7) %!d(string=hace) años
padre
81045a1681
commit
986e661f6c
Se han modificado 10 ficheros con 183 adiciones y 15 borrados
Dividir vista Mostrar estadísticas de diff
  1. 4 4
      build/webpack.prod.conf.js
  2. 1 1
      dist/index.html
  3. 84 0
      gulpfile.js
  4. 7 2
      index.html
  5. 4 0
      package.json
  6. 8 0
      static/config/index-prod.js
  7. 8 0
      static/config/index-qa.js
  8. 8 0
      static/config/index-uat.js
  9. 6 8
      static/config/index.js
  10. 53 0
      static/config/init.js

+ 4 - 4
build/webpack.prod.conf.js
Ver fichero 

@ -26,8 +26,8 @@ const webpackConfig = merge(baseWebpackConfig, {
26 26 
  devtool: config.build.productionSourceMap ? config.build.devtool : false,
27 27 
  output: {
28 28 
    path: config.build.assetsRoot,
29 
    filename: utils.assetsPath('js/[name].js?h=[chunkhash]'),
30 
    chunkFilename: utils.assetsPath('js/[id].js?h=[chunkhash]')
29 
    filename: utils.assetsPath('js/[name].js'),
30 
    chunkFilename: utils.assetsPath('js/[id].js')
31 31 
  },
32 32 
  plugins: [
33 33 
    // http://vuejs.github.io/vue-loader/en/workflow/production.html
 
@ -45,7 +45,7 @@ const webpackConfig = merge(baseWebpackConfig, {
45 45 
    }),
46 46 
    // extract css into its own file
47 47 
    new ExtractTextPlugin({
48 
      filename: utils.assetsPath('css/[name].css?h=[contenthash]'),
48 
      filename: utils.assetsPath('css/[name].css'),
49 49 
      // set the following option to `true` if you want to extract CSS from
50 50 
      // codesplit chunks into this main css file as well.
51 51 
      // This will result in *all* of your app's CSS being loaded upfront.
 
@ -66,7 +66,7 @@ const webpackConfig = merge(baseWebpackConfig, {
66 66 
        ? 'index.html'
67 67 
        : config.build.index,
68 68 
      template: 'index.html',
69 
      inject: true,
69 
      inject: false,
70 70 
      minify: {
71 71 
        removeComments: true,
72 72 
        collapseWhitespace: true,

+ 1 - 1
dist/index.html
Ver fichero 

@ -1 +1 @@
1 
<!DOCTYPE html><html lang=en><head><meta charset=UTF-8><meta name=viewport content="width=device-width,initial-scale=1"><meta http-equiv=X-UA-Compatible content="ie=edge"><title>Vue-cli-basic</title><link href=https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css rel=stylesheet><script src="./static/config/index.js?v=1518060634477"></script><link href="./static/css/app.css?h=39bb32abd521afc45fa041d345d74ff3" rel=stylesheet></head><body><div id=app></div><script type=text/javascript src="./static/js/manifest.js?h=ed67101651177cceff05"></script><script type=text/javascript src="./static/js/vendor.js?h=3e37dd02f0c563bd36a1"></script><script type=text/javascript src="./static/js/app.js?h=6cf147d10afbb61fb994"></script></body></html>
1 
<!DOCTYPE html><html lang=en><head><meta charset=UTF-8><meta name=viewport content="width=device-width,initial-scale=1"><meta http-equiv=X-UA-Compatible content="ie=edge"><title>Vue-cli-basic</title><link href=https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css rel=stylesheet><script src="./config/index.js?h=e77b88202125b8a17bc1"></script></head><body><div id=app></div></body></html>

+ 84 - 0
gulpfile.js
Ver fichero 

@ -0,0 +1,84 @@
1 
var gulp = require('gulp');
2 
var path = require('path');
3 
var concat = require('gulp-concat');
4 
var shell = require('gulp-shell');
5 
var replace = require('gulp-replace');
6 
var del = require('del');
7
8 
var distPath = path.resolve('./dist'); // 输出目录
9 
var version = ''; // 版本号
10 
var versionPath = distPath + '/'; // 版本号文件目录
11 
var nodeEnv = 'qa'; // 环境
12
13 
// 创建版本文件目录名称
14 
(function () {
15 
  var d = new Date();
16 
  version = (d.getFullYear().toString().slice(2))
17 
    + ((d.getMonth() + 1) >= 10 ? (d.getMonth() + 1) : '0' + (d.getMonth() + 1))
18 
    + (d.getDate() >= 10 ? d.getDate() : '0' + d.getDate());
19 
  versionPath += version
20 
})();
21
22 
// 打包
23 
gulp.task('webpack', shell.task([
24 
  'node build/build.js'
25 
]));
26
27 
// 生成版本文件目录中
28 
gulp.task('versionBuild', ['webpack'], function () {
29 
  return gulp.src(`${distPath}/static/**/*`)
30 
    .pipe(gulp.dest(`${versionPath}/static/`))
31 
});
32
33 
// 替换manifest.js占位标记变量
34 
gulp.task('replace', ['versionBuild'], function () {
35 
  return gulp.src(`${versionPath}/static/js/manifest.js`)
36 
    .pipe(replace(/"\.\/"/g, 'window.SITE_CONFIG[\'baseUrl\']'))
37 
    .pipe(gulp.dest(`${versionPath}/static/js/`))
38 
});
39
40 
// 替换${versionPath}/static/config/index-${nodeEnv}.js STATIC_FILENAME变量
41 
// 合并index-${nodeEnv}.js + init.js 到 config/index.js
42 
gulp.task('replaceCdnPath', ['versionBuild'], function () {
43 
  // var txt = 'window.SITE_CONFIG['staticFileName'] = ' + (nodeEnv === 'prod' ? `\'${version}\'` : `\'lt\/${version}\'`)
44 
  return gulp.src([`${versionPath}/static/config/index-${nodeEnv}.js`, `${versionPath}/static/config/init.js`])
45 
    .pipe(replace(/window.SITE_CONFIG['staticFileName'] = \'.*\'/g, `window.SITE_CONFIG['staticFileName'] = \'${version}\'`))
46 
    .pipe(concat('index.js'))
47 
    .pipe(gulp.dest(`${distPath}/config/`))
48 
});
49
50 
// 清空
51 
gulp.task('clean', function () {
52 
  return fnClean([versionPath])
53 
});
54 
function fnClean (path) {
55 
  return del(path)
56 
}
57
58 
gulp.task('default', function () {
59 
  console.log('\n测试环境打包使用: gulp qa \n验收环境打包使用：gulp uat \n生产环境打包使用：gulp prod\n')
60 
});
61
62 
// 测试环境
63 
gulp.task('qa', ['clean'], function () {
64 
  nodeEnv = 'qa';
65 
  gulp.start(['replace', 'replaceCdnPath'], function () {
66 
    fnClean([`${distPath}/static`, `${versionPath}/static/config`])
67 
  })
68 
});
69
70 
// 验收环境
71 
gulp.task('uat', ['clean'], function () {
72 
  nodeEnv = 'uat';
73 
  gulp.start(['replace', 'replaceCdnPath'], function () {
74 
    fnClean([`${distPath}/static`, `${versionPath}/static/config`])
75 
  })
76 
});
77
78 
// 生成环境
79 
gulp.task('prod', ['clean'], function () {
80 
  nodeEnv = 'prod';
81 
  gulp.start(['replace', 'replaceCdnPath'], function () {
82 
    fnClean([`${distPath}/static`, `${versionPath}/static/config`])
83 
  })
84 
});

+ 7 - 2
index.html
Ver fichero 

@ -6,10 +6,15 @@
6 6 
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
7 7 
  <title>Vue-cli-basic</title>
8 8 
  <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
9 
  <script src="./static/config/index.js?v=<%=new Date().getTime()%>"></script>
10 9 
</head>
11 10 
<body>
12 11 
  <div id="app"></div>
13 
  <!-- built files will be auto injected -->
12 
  <% if (process.env.NODE_ENV === 'production') { %>
13 
    <!-- 生产环境 -->
14 
    <script src="./config/index.js?h=<%=compilation.hash%>"></script>
15 
  <% }else { %>
16 
    <!-- 开发环境 -->
17 
    <script src="./static/config/index.js?h=<%=compilation.hash%>"></script>
18 
  <% } %>
14 19 
</body>
15 20 
</html>

+ 4 - 0
package.json
Ver fichero 

@ -18,6 +18,10 @@
18 18 
    "babel-plugin-component": "0.10.1",
19 19 
    "babel-polyfill": "6.26.0",
20 20 
    "element-ui": "2.1.0",
21 
    "gulp": "^3.9.1",
22 
    "gulp-concat": "^2.6.1",
23 
    "gulp-replace": "^0.6.1",
24 
    "gulp-shell": "^0.6.5",
21 25 
    "vue": "2.5.2",
22 26 
    "vue-cookie": "1.1.4",
23 27 
    "vue-router": "3.0.1",

+ 8 - 0
static/config/index-prod.js
Ver fichero 

@ -0,0 +1,8 @@
1 
;(function () {
2 
  window.SITE_CONFIG = {}
3 
  window.SITE_CONFIG['baseUrl'] = '//demo.renren.io/renren-fast/' // api请求地址
4 
  window.SITE_CONFIG['nestIframeUrl'] = '//demo.renren.io/renren-fast/' // 嵌套iframe地址
5 
  window.SITE_CONFIG['nestIframeRouteNameList'] = ['sql'] // 嵌套iframe路由名称列表
6 
  window.SITE_CONFIG['staticFileName'] = '' // 静态文件目录名称
7 
  window.SITE_CONFIG['cdnUrl'] = './' + window.SITE_CONFIG.staticFileName // cdn地址
8 
})();

+ 8 - 0
static/config/index-qa.js
Ver fichero 

@ -0,0 +1,8 @@
1 
;(function () {
2 
  window.SITE_CONFIG = {}
3 
  window.SITE_CONFIG['baseUrl'] = '//demo.renren.io/renren-fast/' // api请求地址
4 
  window.SITE_CONFIG['nestIframeUrl'] = '//demo.renren.io/renren-fast/' // 嵌套iframe地址
5 
  window.SITE_CONFIG['nestIframeRouteNameList'] = ['sql'] // 嵌套iframe路由名称列表
6 
  window.SITE_CONFIG['staticFileName'] = '' // 静态文件目录名称
7 
  window.SITE_CONFIG['cdnUrl'] = './' + window.SITE_CONFIG.staticFileName // cdn地址
8 
})();

+ 8 - 0
static/config/index-uat.js
Ver fichero 

@ -0,0 +1,8 @@
1 
;(function () {
2 
  window.SITE_CONFIG = {}
3 
  window.SITE_CONFIG['baseUrl'] = '//demo.renren.io/renren-fast/' // api请求地址
4 
  window.SITE_CONFIG['nestIframeUrl'] = '//demo.renren.io/renren-fast/' // 嵌套iframe地址
5 
  window.SITE_CONFIG['nestIframeRouteNameList'] = ['sql'] // 嵌套iframe路由名称列表
6 
  window.SITE_CONFIG['staticFileName'] = '' // 静态文件目录名称
7 
  window.SITE_CONFIG['cdnUrl'] = './' + window.SITE_CONFIG.staticFileName // cdn地址
8 
})();

+ 6 - 8
static/config/index.js
Ver fichero 

@ -1,10 +1,8 @@
1 1 
;(function () {
2 
  window.SITE_CONFIG = {
3 
    // api请求地址
4 
    baseUrl: '//demo.renren.io/renren-fast/',
5 
    // 嵌套iframe地址
6 
    nestIframeUrl: '//demo.renren.io/renren-fast/',
7 
    // 嵌套iframe路由名称列表
8 
    nestIframeRouteNameList: ['sql']
9 
  }
2 
  window.SITE_CONFIG = {}
3 
  window.SITE_CONFIG['baseUrl'] = '//demo.renren.io/renren-fast/' // api请求地址
4 
  window.SITE_CONFIG['nestIframeUrl'] = '//demo.renren.io/renren-fast/' // 嵌套iframe地址
5 
  window.SITE_CONFIG['nestIframeRouteNameList'] = ['sql'] // 嵌套iframe路由名称列表
6 
  window.SITE_CONFIG['staticFileName'] = '' // 静态文件目录名称
7 
  window.SITE_CONFIG['cdnUrl'] = './' + window.SITE_CONFIG['staticFileName'] // cdn地址
10 8 
})()

+ 53 - 0
static/config/init.js
Ver fichero 

@ -0,0 +1,53 @@
1 
;(function(window, document) {
2 
  var resList = {
3 
    css: [
4 
      window.SITE_CONFIG['cdnUrl'] + '/static/css/app.css'
5 
    ],
6 
    js: [
7 
      window.SITE_CONFIG['cdnUrl'] + '/static/js/manifest.js',
8 
      window.SITE_CONFIG['cdnUrl'] + '/static/js/vendor.js',
9 
      window.SITE_CONFIG['cdnUrl'] + '/static/js/app.js'
10 
    ]
11 
  };
12
13 
  (function () {
14 
    document.getElementsByTagName('html')[0].style.opacity = 0;
15 
    var i = 0;
16 
    var _style = null;
17 
    var createStyles = function () {
18 
      if (i >= resList.css.length) {
19 
        document.getElementsByTagName('html')[0].style.opacity = 1;
20 
        return;
21 
      }
22 
      _style = document.createElement('link');
23 
      _style.href = resList.css[i];
24 
      _style.setAttribute('rel', 'stylesheet');
25 
      _style.onload = function () {
26 
        i++;
27 
        createStyles();
28 
      }
29 
      document.getElementsByTagName('head')[0].appendChild(_style);
30 
    }
31 
    createStyles();
32 
  })();
33
34 
  document.onreadystatechange = function () {
35 
    if (document.readyState === 'interactive') {
36 
      var i = 0;
37 
      var _script = null;
38 
      var createScripts = function () {
39 
        if (i >= resList.js.length) {
40 
          return;
41 
        }
42 
        _script = document.createElement('script');
43 
        _script.src = resList.js[i];
44 
        _script.onload = function () {
45 
          i++;
46 
          createScripts();
47 
        }
48 
        document.getElementsByTagName('body')[0].appendChild(_script);
49 
      }
50 
      createScripts();
51 
    }
52 
  };
53 
})(window, document);