• 按需导入vant-ui


    1.同样的可以dependencies安装:npm install vant -S,

    "vant": "^2.12.6",
    可以devDependencies安装:babel-plugin-import
    "babel-plugin-import": "^1.13.3",
    2.配置文件babel.config.js(或者.babelrc或者package.js中配置)添加配置:
    plugins: [
            [
                "import",
                {
                    libraryName: "vant",
                    libraryDirectory: "es",
                    style: true,
                },
            ],
        ],
    

      babel-plugin-import是一款babel插件,在编译过程中将import的写法自动转换成按需引入的方式。

    3.新增文件src/modules/vantUsed.js

    import Vue from "vue";
    import { Button, Popup } from "vant";
    
    Vue.component()注册组件等。
    Vue.use(Button)
    Vue.use(Popup)
    
    
    // 或者采用Vue.component()方法注册全局组件。
    
    // const components = [Button, Popup];
    // components.forEach((component) => {
    //     Vue.component(component.name, component);
    // });
    

      两种方式均可注册全局组件。

    4.main.js引入src/modules/vantUsed.js(直接main.js文件中导入、注册vant组件也可以)。
    工欲善其事 必先利其器
  • 相关阅读:
    冲刺阶段 day1
    目标系统流程图 数据流图
    团队作业二
    校外实习报告(十二)
    校外实习报告(十一)
    第二周实习总结
    校外实习报告(十)
    校外实习报告(九)
    校外实习报告(八)
    校外实习报告(七)
  • 原文地址:https://www.cnblogs.com/fengyouqi/p/14445236.html
Copyright © 2020-2023  润新知