Página inicial Explorar Ajuda
Entrar
jianyu
/
page_datareport
5
0
Fork 0
Arquivos Issues 0 Pull Requests 0 Wiki
Ver código fonte

添加页面结构

cuiyalong 5 anos atrás
pai
480a2aa3fb
commit
d2b224ecf4
7 arquivos alterados com 107 adições e 18 exclusões
Visão dividida Mostrar estatísticas do Diff
  1. 4 3
      package.json
  2. 3 14
      public/index.html
  3. 1 1
      src/views/Test.vue
  4. 23 0
      src/views/buy/Buy.vue
  5. 23 0
      src/views/main/Home.vue
  6. 23 0
      src/views/pay/Pay.vue
  7. 30 0
      vue.config.js

+ 4 - 3
package.json
Ver arquivo 

@@ -6,7 +6,8 @@
 
     "serve": "vue-cli-service serve",
 
     "build": "vue-cli-service build --mode production",
 
     "lint": "vue-cli-service lint --fix",
 
-    "analyzer": "use_analyzer=true vue-cli-service build --mode production"
 
+    "analyzer": "use_analyzer=true vue-cli-service build --mode production",
 
+    "analyze": "cross-env use_analyzer=true vue-cli-service build --mode production"
 
   },
 
   "dependencies": {
 
     "axios": "^0.19.2",
 
@@ -36,6 +37,7 @@
 
     "amfe-flexible": "^2.2.1",
 
     "autoprefixer": "^9.7.4",
 
     "babel-plugin-import": "^1.13.0",
 
+    "cross-env": "^7.0.2",
 
     "eslint": "^6.7.2",
 
     "eslint-plugin-import": "^2.20.1",
 
     "eslint-plugin-node": "^11.0.0",
 
@@ -43,12 +45,11 @@
 
     "eslint-plugin-standard": "^4.0.0",
 
     "eslint-plugin-vue": "^6.1.2",
 
     "node-sass": "^4.13.1",
 
-    "postcss-pxtorem": "^5.1.1",
 
     "postcss-px-to-viewport": "^1.1.1",
 
+    "postcss-pxtorem": "^5.1.1",
 
     "sass-loader": "^8.0.2",
 
     "ts-import-plugin": "^1.6.5",
 
     "typescript": "~3.7.5",
 
-    "vconsole": "^3.3.4",
 
     "vue-template-compiler": "^2.6.11",
 
     "webpack-bundle-analyzer": "^3.6.1"
 
   }

+ 3 - 14
public/index.html
Ver arquivo 

@@ -18,20 +18,9 @@
 
     <meta name="format-detection" content="telephone=no">
 
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
     <title><%= htmlWebpackPlugin.options.title %></title>
 
-    <% if (process.env.NODE_ENV === 'production') { %>
 
-    <link href="https://cdn.bootcss.com/vue/2.6.11/vue.min.js" rel="preload" as="script" />
 
-    <link href="https://cdn.bootcss.com/vue-router/3.1.3/vue-router.min.js" rel="preload" as="script" />
 
-    <link href="https://cdn.bootcss.com/vuex/3.1.2/vuex.min.js" rel="preload" as="script" />
 
-    <link href="https://cdn.bootcss.com/axios/0.19.2/axios.min.js" rel="preload" as="script" />
 
-    <link href="https://cdn.bootcss.com/js-cookie/2.2.1/js.cookie.min.js" rel="preload" as="script" />
 
-    <script src="https://cdn.bootcdn.net/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
 
-    <script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script>
 
-    <script src="https://cdn.bootcss.com/vue-router/3.1.3/vue-router.min.js"></script>
 
-    <script src="https://cdn.bootcss.com/vuex/3.1.2/vuex.min.js"></script>
 
-    <script src="https://cdn.bootcss.com/axios/0.19.2/axios.min.js"></script>
 
-    <script src="https://cdn.bootcss.com/js-cookie/2.2.1/js.cookie.min.js"></script>
 
-    <script src="https://cdn.jsdelivr.net/npm/vant@2.5.7/lib/vant.min.js"></script>
 
-    <script src="//res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
 
+    <!-- 使用CDN的JS文件 -->
 
+    <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.js) { %>
 
+      <script type="text/javascript" src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
 
     <% } %>
 
   </head>
 
   <body>

+ 1 - 1
src/views/Test.vue
Ver arquivo 

@@ -66,7 +66,7 @@ export default class Test extends Vue {
 
   confTestArr = [
 
     {
 
       title: '开发环境',
 
-      baseUrl: 'http://192.168.20.216:8080/page_entniche',
 
+      baseUrl: 'http://192.168.20.216:8080/page',
 
       subTitle: '20.216',
 
       urls: [
 
         {

+ 23 - 0
src/views/buy/Buy.vue
Ver arquivo 

@@ -0,0 +1,23 @@
 
+<template>
 
+  <div class="report-buy">
 
+    <div class="j-main">
 
+      介绍页面
 
+    </div>
 
+    <div class="j-button-group j-footer">
 
+      <button class="j-button-confirm">立即支付</button>
 
+    </div>
 
+  </div>
 
+</template>
 
+<script>
 
+import { Component, Vue } from 'vue-property-decorator'
 
+
 
+@Component({
 
+  name: 'buy'
 
+})
 
+
 
+export default class Buy extends Vue {}
 
+</script>
 
+
 
+<style lang="scss">
 
+  .report-buy {}
 
+</style>

+ 23 - 0
src/views/main/Home.vue
Ver arquivo 

@@ -0,0 +1,23 @@
 
+<template>
 
+  <div class="report-home">
 
+    <div class="j-main">
 
+      介绍页面
 
+    </div>
 
+    <div class="j-button-group j-footer">
 
+      <button class="j-button-confirm">立即支付</button>
 
+    </div>
 
+  </div>
 
+</template>
 
+<script>
 
+import { Component, Vue } from 'vue-property-decorator'
 
+
 
+@Component({
 
+  name: 'home'
 
+})
 
+
 
+export default class Home extends Vue {}
 
+</script>
 
+
 
+<style lang="scss">
 
+  .report-home {}
 
+</style>

+ 23 - 0
src/views/pay/Pay.vue
Ver arquivo 

@@ -0,0 +1,23 @@
 
+<template>
 
+  <div class="j-pay">
 
+    <div class="j-main">
 
+      支付
 
+    </div>
 
+    <div class="j-button-group j-footer">
 
+      <button class="j-button-confirm">立即支付</button>
 
+    </div>
 
+  </div>
 
+</template>
 
+<script>
 
+import { Component, Vue } from 'vue-property-decorator'
 
+
 
+@Component({
 
+  name: 'pay'
 
+})
 
+
 
+export default class Pay extends Vue {}
 
+</script>
 
+
 
+<style lang="scss">
 
+  .j-pay {}
 
+</style>

+ 30 - 0
vue.config.js
Ver arquivo 

@@ -18,6 +18,22 @@ const externals = {
 
   vant: 'vant',
 
   moment: 'moment'
 
 }
 
+
 
+const cdn = {
 
+  // 访问https://unpkg.com/element-ui/lib/theme-chalk/index.css获取最新版本
 
+  // css: ['//unpkg.com/element-ui@2.10.1/lib/theme-chalk/index.css'],
 
+  js: [
 
+    '//cdn.bootcss.com/vue/2.6.11/vue.min.js',
 
+    '//cdn.bootcss.com/vue-router/3.1.3/vue-router.min.js',
 
+    '//cdn.bootcss.com/vuex/3.1.2/vuex.min.js',
 
+    '//cdn.bootcss.com/axios/0.19.2/axios.min.js',
 
+    '//cdn.bootcss.com/js-cookie/2.2.1/js.cookie.min.js',
 
+    '//cdn.bootcdn.net/ajax/libs/moment.js/2.24.0/moment.min.js',
 
+    '//cdn.jsdelivr.net/npm/vant@2.5.7/lib/vant.min.js',
 
+    '//res.wx.qq.com/open/js/jweixin-1.6.0.js'
 
+  ]
 
+}
 
+
 
 module.exports = {
 
   publicPath: process.env.BASE_URL,
 
   parallel: false,
 
@@ -72,12 +88,26 @@ module.exports = {
 
     if (process.env.NODE_ENV === 'production') {
 
       // 打包时需要执行，开发环境运行不需要执行
 
       config.externals(externals)
 
+
 
+      // 如果使用多页面打包，使用vue inspect --plugins查看html是否在结果数组中
 
+      config.plugin('html').tap(args => {
 
+        // html中添加cdn
 
+        args[0].cdn = cdn
 
+        // console.log(JSON.stringify(args))
 
+
 
+        // 修复 Lazy loading routes Error
 
+        // args[0].chunksSortMode = 'none'
 
+        return args
 
+      })
 
     }
 
+
 
+    // 分析静态资源
 
     if (process.env.use_analyzer) {
 
       config
 
         .plugin('webpack-bundle-analyzer')
 
         .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
 
     }
 
+
 
     config.module
 
       .rule('ts')
 
       .use('ts-loader')