ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

如何搭建一个VUE+Element前端项目(保姆级教学)

2022-01-19 15:02:00  阅读:121  来源: 互联网

标签:npm vue 项目 Element VUE element 安装 回车 搭建


1.安装Node环境

1.node.js下载安装不过多赘述。

这样就算安装成功。

2.搭建vue项目环境

 1、全局安装vue-cli

  npm install --global vue-cli

警告不用管(我自己也不知道啥意思能跑起来不报错就完事了)

2.创建项目文件

输入命令行:vue init webpack +你的项目名

框起来的部分就是你创建的项目所在的文件路径 

说明:

    Vue build ==> 打包方式,回车即可;

    Install vue-router ==> 是否要安装 vue-router,项目中肯定要使用到 所以Y 回车;

    Use ESLint to lint your code ==> 是否需要 js 语法检测 目前我们不需要 所以 n 回车;

    Set up unit tests ==> 是否安装 单元测试工具 目前我们不需要 所以 n 回车;

    Setup e2e tests with Nightwatch ==> 是否需要 端到端测试工具 目前我们不需要 所以 n 回车;

3.npm install 安装依赖

安装之后你的项目目录里会多一个 node_moulds文件夹,这里面是依赖包

 4.npm run dev 启动项目

这样就成功啦 !!!

复制网址打开

3.引入elementUI

elementui官网:Element - 网站快速成型工具icon-default.png?t=M0H8https://element.eleme.cn/#/zh-CN

1.npm 安装

推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用。

npm i element-ui -S

2.全局引入elementui

打开项目中的main.js文件 加入以下内容

import Element from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(Element)

 重新启动以下项目就安装完成啦,可以使用element的组件库啦!!

标签:npm,vue,项目,Element,VUE,element,安装,回车,搭建
来源: https://blog.csdn.net/m0_57958926/article/details/122580482

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有