Kaynağa Gözat

修复打包的BUG。

yangzhijie 4 yıl önce
ebeveyn
işleme
07b8abdfe9

+ 5 - 1
package.json

@@ -1,6 +1,6 @@
 {
   "name": "pc-component-v3",
-  "version": "1.0.0",
+  "version": "1.0.3",
   "description": "",
   "main": "dist/pc-component-v3.js",
   "scripts": {
@@ -11,6 +11,10 @@
   "directories": {
     "dist": "dist"
   },
+  "files": [
+    "package.json",
+    "dist"
+  ],
   "author": "shang hai leanwo",
   "license": "Leanwo Business Software License",
   "devDependencies": {

+ 32 - 23
packages/index.js

@@ -35,7 +35,7 @@ import TreeViewNode from './tree/index.js';
 import langZhCn from './i18n/zh-CN.js';
 import langEnUs from './i18n/en-US.js';
 
-import VueI18n from 'vue-i18n';
+// import VueI18n from 'vue-i18n';
 
 
 import Uuid from './common/Uuid.js';
@@ -81,42 +81,51 @@ const components = [
 ];
 
 
-const install = function (Vue, opts = {}) {
+const install = function (app, opts = {}) {
+  console.log('start install.');
   /* istanbul ignore if */
-  if (install.installed) return;
+  if (install.installed){
+    console.log('pc-component-v3 already installed.');
+    return;
+  }
 
     
-  Vue.use(VueI18n);
-
-  Vue.mixin({
-    beforeCreate() {
-      var _self = this;
-      // 这里为了防止 beforeCreate 比 vue-i18n 的 beforeCreate 先执行导致 this.$i18n 为空
-      this.$nextTick(() => {
-        // 判断是否为根节点,合并国际化信息
-        //if (this.$root === this && this.$i18n) {
-        if (this.$i18n) {
-          _self.$i18n.mergeLocaleMessage('zh-CN', langZhCn);
-          _self.$i18n.mergeLocaleMessage('en-US', langEnUs);
-        }
-      });
-    },
-  });
+  // Vue.use(VueI18n);
+
+  // Vue.mixin({
+  //   beforeCreate() {
+  //     var _self = this;
+  //     // 这里为了防止 beforeCreate 比 vue-i18n 的 beforeCreate 先执行导致 this.$i18n 为空
+  //     this.$nextTick(() => {
+  //       // 判断是否为根节点,合并国际化信息
+  //       //if (this.$root === this && this.$i18n) {
+  //       if (this.$i18n) {
+  //         _self.$i18n.mergeLocaleMessage('zh-CN', langZhCn);
+  //         _self.$i18n.mergeLocaleMessage('en-US', langEnUs);
+  //       }
+  //     });
+  //   },
+  // });
 
   // locale.use(opts.locale);
   // locale.i18n(opts.i18n);
 
   components.map(component => {
     console.log('install component: ' + component.name);
-    Vue.component(component.name, component);
+    app.component(component.name, component);
   });
+
+  install.installed = true;
+
+  
+  console.log('install finished.');
 };
 
 
 /* istanbul ignore if */
-if (typeof window !== 'undefined' && window.Vue) {
-  install(window.Vue);
-};
+// if (typeof window !== 'undefined' && window.Vue) {
+//   install(window.Vue);
+// };
 
 
 export default {

+ 6 - 4
packages/info/src/InfoMultiSearchWidget.vue

@@ -31,14 +31,14 @@
         <div>{{ infoWindowDto.name }}</div>
       </template>
       <template #default>
-        <InfoFilter
+        <!-- <InfoFilter
           ref="info"
           :field-value="fieldValue"
           :where-clause="whereClause"
           :is-search-widget="true"
           @data-selected="dataSelected"
           @delete-selected="deleteSelected"
-        />
+        /> -->
       </template>
     </Modal>
     <Loading ref="loading" />
@@ -46,13 +46,15 @@
 </template>
 <script>
 var Modal = require('../../modal/src/Modal.vue').default;
-var InfoFilter = require('./InfoWindow.vue').default;
+// var InfoFilter = require('./InfoWindow.vue').default;
 var Loading = require('../../loading/src/Loading.vue').default;
 
 export default {
 
   components: {
-    Modal, InfoFilter, Loading,
+    Modal, 
+    // InfoFilter, 
+    Loading,
   },
   props: {
     'infoWindowNo':{

+ 2 - 2
packages/info/src/InfoSearchWidget.vue

@@ -29,14 +29,14 @@
         <div>{{ titleName }}</div>
       </template>
       <template #default>
-        <InfoWindow
+        <!-- <InfoWindow
           v-if="showSubInfoWindow"
           ref="info"
           :where-clause="whereClause"
           :field-value="fieldValue"
           :is-search-widget="true"
           @data-selected="dataSelected"
-        />
+        /> -->
       </template>
     </Modal>
     <SearchAutoCompleteWidget

+ 7 - 4
packages/info/src/SearchWidget.vue

@@ -34,14 +34,14 @@
       @cancel="searchDialogCancel"
     >
       <template #default>
-        <info
+        <!-- <info
           ref="info"
           :field-value="fieldValue"
           :where-clause="whereClause"
           :is-search-widget="true"
           :model-data="modelData"
           @data-selected="dataSelected"
-        />
+        /> -->
       </template>
       <template #header>
         <div>{{ titleName }}</div>
@@ -63,7 +63,7 @@
 
 <script>
 var Modal = require('../../modal/src/Modal.vue').default;
-var Info = require('./InfoWindow.vue').default;
+// var Info = require('./InfoWindow.vue').default;
 var SearchAutoCompleteWidget = require('./SearchAutoCompleteWidget.vue').default;
 var Loading = require('../../loading/src/Loading.vue').default;
 
@@ -71,7 +71,10 @@ export default {
   name: 'SearchWidget',
 
   components: {
-    Modal, Info, SearchAutoCompleteWidget, Loading,
+    Modal, 
+    // Info, 
+    SearchAutoCompleteWidget, 
+    Loading,
   },
   // infoWindowNo: 查询窗口编号
   // fieldValue: 显示的值

+ 98 - 67
packages/modal/src/Modal.vue

@@ -1,11 +1,25 @@
 <template>
-  <div v-show="show" :transition="transition">
-    <div class="modal" @click.self="clickMask">
-      <div class="modal-dialog" :class="modalClass" name="dialog">
+  <div
+    v-show="show"
+    :transition="transition"
+  >
+    <div
+      class="modal"
+      @click.self="clickMask"
+    >
+      <div
+        class="modal-dialog"
+        :class="modalClass"
+        name="dialog"
+      >
         <div class="modal-content">
           <!--Header-->
           <div class="modal-header">
-            <a type="button" class="close" @click="cancel">x</a>
+            <a
+              type="button"
+              class="close"
+              @click="cancel"
+            >x</a>
             <h4 class="modal-title">
               <slot name="header">
                 {{ title }}
@@ -18,8 +32,22 @@
           </div>
           <!--Footer-->
           <div class="modal-footer">
-            <button v-if="showCanelButton" type="button" class="btn btn-info" @click="cancel">{{ cancelText }}</button>
-            <button v-if="showOkButton" type="button" class="btn btn-primary" @click="ok">{{ okText }}</button>
+            <button
+              v-if="showCanelButton"
+              type="button"
+              class="btn btn-info"
+              @click="cancel"
+            >
+              {{ cancelText }}
+            </button>
+            <button
+              v-if="showOkButton"
+              type="button"
+              class="btn btn-primary"
+              @click="ok"
+            >
+              {{ okText }}
+            </button>
             <slot name="footer" />
           </div>
         </div>
@@ -35,7 +63,7 @@ var ModalFix = require('./ModalFix.js').default;
 
 export default {
   // eslint-disable-next-line
-  name: 'Modal',
+    name: 'Modal',
   props: {
     title: {
       type: String,
@@ -77,20 +105,20 @@ export default {
 
   emits: ['ok', 'cancel', 'close'],
 
-  data: function(){
+  data: function () {
     return {
       show: false,
       okText: '确定',
       cancelText: '取消',
       closeText: '关闭',
-      okClass : '',
-      cancelClass : '',
+      okClass: '',
+      cancelClass: '',
       closeClass: '',
     };
   },
 
   computed: {
-    modalClass : function() {
+    modalClass: function () {
       return {
         'modal-lg': this.large || this.large == 'true',
         'modal-sm': this.small || this.small == 'true',
@@ -99,76 +127,76 @@ export default {
     },
   },
   watch: {
-    show : function (value) {
+    show: function (value) {
       console.log('modal watch show = ' + value);
       // 在显示时去掉body滚动条,防止出现双滚动条
       if (value) {
-        if(document.body.className.indexOf('modal-open') < 0){
+        if (document.body.className.indexOf('modal-open') < 0) {
           document.body.className += ' modal-open';
         }
       } else {
-        this.$nextTick(function(){
+        this.$nextTick(function () {
           ModalFix.fix();
         });
       }
     },
   },
-        
-  created: function() {
+
+  created: function () {
     if (this.show) {
-      if(document.body.className.indexOf('modal-open') < 0){
+      if (document.body.className.indexOf('modal-open') < 0) {
         document.body.className += ' modal-open';
       }
     }
   },
-  
+
 
   methods: {
-    ok: function() {
+    ok: function () {
       this.$emit('ok');
       this.show = false;
-      this.$nextTick(function(){
+      this.$nextTick(function () {
         ModalFix.fix();
-      });           
+      });
     },
 
     cancel: function () {
       this.$emit('cancel');
       this.show = false;
-      this.$nextTick(function(){
+      this.$nextTick(function () {
         ModalFix.fix();
       });
     },
 
-    close: function() {
+    close: function () {
       this.$emit('close');
       this.show = false;
-      this.$nextTick(function(){
+      this.$nextTick(function () {
         ModalFix.fix();
-      });           
+      });
     },
 
     // 点击遮罩层
     clickMask: function () {
       if (!this.force) {
         this.cancel();
-        this.$nextTick(function(){
+        this.$nextTick(function () {
           ModalFix.fix();
         });
       }
     },
-        
+
     /**
-         * 显示
-         */
-    showModal: function(){
+             * 显示
+             */
+    showModal: function () {
       this.show = true;
     },
-        
+
     /**
-         * 隐藏
-         */
-    hideModal: function(){
+             * 隐藏
+             */
+    hideModal: function () {
       this.show = false;
     },
   },
@@ -177,37 +205,40 @@ export default {
 
 
 <style scoped>
-    .modal {
-        display: block;
-    }
-    .modal-transition {
-        transition: all .6s ease;
-    }
-    .modal-leave {
-        /* 样式没什么用,但可以让根标签的transitionEnd生效,以去掉modal-leave */
-        border-radius: 1px !important;
-    }
-    .modal-transition .modal-dialog, .modal-transition .modal-backdrop {
-        transition: all .5s ease;
-    }
-    .modal-enter .modal-dialog, .modal-leave .modal-dialog {
-        opacity: 0;
-        transform: translateY(-30%);
-    }
-
-    .modal-enter .modal-backdrop, .modal-leave .modal-backdrop {
-        opacity: 0;
-    }
-
-    .modal-full{
-        width: 95%;
-    }
-
-    .modal-lg{
-        width: 75%;
-    }
-
-    .modal-sm{
-        width: 50%;
-    }
+.modal {
+    display: block;
+}
+.modal-transition {
+    transition: all 0.6s ease;
+}
+.modal-leave {
+    /* 样式没什么用,但可以让根标签的transitionEnd生效,以去掉modal-leave */
+    border-radius: 1px !important;
+}
+.modal-transition .modal-dialog,
+.modal-transition .modal-backdrop {
+    transition: all 0.5s ease;
+}
+.modal-enter .modal-dialog,
+.modal-leave .modal-dialog {
+    opacity: 0;
+    transform: translateY(-30%);
+}
+
+.modal-enter .modal-backdrop,
+.modal-leave .modal-backdrop {
+    opacity: 0;
+}
+
+.modal-full {
+    width: 95%;
+}
+
+.modal-lg {
+    width: 75%;
+}
+
+.modal-sm {
+    width: 50%;
+}
 </style>

+ 8 - 0
webpack.base.js

@@ -49,12 +49,20 @@ module.exports = {
   performance: {
     hints: false
   },
+  
+  // 不把第三方库打包到bundle中
   externals: {
     jQuery: 'window.$',
     jquery: 'window.$',
     $: 'window.$',
     bootstrap: 'bootstrap',
     moment: 'moment',
+    // 不将vue代码打包进我们的组件库代码中,如果将vue代码打包进组件库中则会报错
+    vue: 'vue',
+    'vue-i18n': 'vue-i18n',
+    'vue-router': 'vue-router',
+    'v-tooltip': 'v-tooltip',
+    'vuedraggable': 'vuedraggable'
   },
   plugins: [
     new VueLoaderPlugin(),

+ 4 - 4
webpack.lib.js

@@ -4,7 +4,7 @@ const WebpackMerge = require('webpack-merge')
 const baseConfig = require('./webpack.base.js')
 
 module.exports = WebpackMerge.merge(baseConfig,{
-  mode: 'production',
+  mode: 'development',
   // 发布组件
   entry: "./packages/index.js",
   output: {
@@ -24,8 +24,8 @@ module.exports = WebpackMerge.merge(baseConfig,{
     //     warnings: false
     //   }
     // }),
-    new webpack.LoaderOptionsPlugin({
-      minimize: true
-    })
+    // new webpack.LoaderOptionsPlugin({
+    //   minimize: false
+    // })
   ])
 });