Vue项目-后台管理系统（二）vue-cli脚手架的搭建

最新推荐文章于 2025-09-13 14:32:35 发布

原创

最新推荐文章于 2025-09-13 14:32:35 发布 · 416 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #前端

本文介绍了如何在Vue项目中搭建后台管理系统，详细阐述了安装element-ui、引入vue-router以及实现点击按钮加载不同页面的步骤。首先，通过npm安装element-ui并选择全局或按需引入；接着，安装vue-router并配置路由；最后，通过修改组件和配置，实现了按钮触发页面切换的功能。

1. 安装element-ui

在项目中引入，使用npm方式：npm I element-ui -S

（1）全局引入，在main.js中写入以下内容

import Vue from 'vue';

import ElementUI from 'element-ui';

import 'element-ui/lib/theme-chalk/index.css';

import App from './App.vue';



Vue.use(ElementUI);



new Vue({

                     el: '#app',

                     render: h => h(App)

    });

（2）按需引入

借助 babel-plugin-c