Browse Source

iview组件按需加载

Michael Wang 6 years ago
parent
commit
f638303cf9
4 changed files with 58 additions and 2 deletions
  1. 9 0
      babel.config.js
  2. 1 0
      package.json
  3. 40 2
      src/plugins/iview.js
  4. 8 0
      yarn.lock

+ 9 - 0
babel.config.js

@@ -1,5 +1,14 @@
 module.exports = {
 module.exports = {
   presets: ["@vue/app"],
   presets: ["@vue/app"],
+  plugins: [
+    [
+      "import",
+      {
+        libraryName: "iview",
+        libraryDirectory: "src/components"
+      }
+    ]
+  ],
   env: {
   env: {
     production: {
     production: {
       plugins: ["transform-remove-console"]
       plugins: ["transform-remove-console"]

+ 1 - 0
package.json

@@ -21,6 +21,7 @@
   "dependencies": {
   "dependencies": {
     "@chenfengyuan/vue-qrcode": "^1.0.0",
     "@chenfengyuan/vue-qrcode": "^1.0.0",
     "axios": "^0.18.0",
     "axios": "^0.18.0",
+    "babel-plugin-import": "^1.11.0",
     "iview": "^3.1.2",
     "iview": "^3.1.2",
     "moment": "^2.22.2",
     "moment": "^2.22.2",
     "register-service-worker": "^1.5.2",
     "register-service-worker": "^1.5.2",

+ 40 - 2
src/plugins/iview.js

@@ -1,6 +1,44 @@
 import Vue from "vue";
 import Vue from "vue";
-import iView from "iview";
+// import iView from "iview";
 
 
-Vue.use(iView);
+import {
+  Button,
+  Form,
+  FormItem,
+  Input,
+  Icon,
+  Message,
+  Poptip,
+  Breadcrumb,
+  BreadcrumbItem,
+  Modal,
+  Upload,
+  Select,
+  Spin,
+  Notice,
+  Option
+} from "iview";
+Vue.component("Button", Button);
+Vue.component("Form", Form);
+Vue.component("FormItem", FormItem);
+Vue.component("Input", Input);
+Vue.component("Icon", Icon);
+Vue.component("Message", Message);
+Vue.component("Poptip", Poptip);
+Vue.component("Breadcrumb", Breadcrumb);
+Vue.component("BreadcrumbItem", BreadcrumbItem);
+Vue.component("Modal", Modal);
+Vue.component("Upload", Upload);
+Vue.component("Select", Select);
+Vue.component("Spin", Spin);
+Vue.component("Notice", Notice);
+Vue.component("Option", Option);
+
+Vue.prototype.$Message = Message;
+Vue.prototype.$Modal = Modal;
+Vue.prototype.$Spin = Spin;
+Vue.prototype.$Notice = Notice;
+
+// Vue.use(iView);
 
 
 import "iview/dist/styles/iview.css";
 import "iview/dist/styles/iview.css";

+ 8 - 0
yarn.lock

@@ -1612,6 +1612,14 @@ babel-plugin-dynamic-import-node@^2.2.0:
   dependencies:
   dependencies:
     object.assign "^4.1.0"
     object.assign "^4.1.0"
 
 
+babel-plugin-import@^1.11.0:
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-import/-/babel-plugin-import-1.11.0.tgz#78ac908e6b225206babb734e19eae5f78d6d1035"
+  integrity sha512-de9dWdU1YjmWRPYurlHRKD2hTd24z0bIQ0/JgyXqLMXML+TsvEkVhtqzOsNtu9MmCuvwBiTTTjZBbZXA1Xu7TQ==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@babel/runtime" "^7.0.0"
+
 babel-plugin-istanbul@^4.1.6:
 babel-plugin-istanbul@^4.1.6:
   version "4.1.6"
   version "4.1.6"
   resolved "https://registry.yarnpkg.com/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.6.tgz#36c59b2192efce81c5b378321b74175add1c9a45"
   resolved "https://registry.yarnpkg.com/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.6.tgz#36c59b2192efce81c5b378321b74175add1c9a45"