使用脚手架搭建vue项目
全局安装环境
安装webpack
npm install webpack -g
安装vue脚手架
npm install -g @vue/cli-init
初始化vue项目
vue init webpack [projectName]
注意: vue不是内部命令错误修复。全局搜索vue.cmd,将此目录配入环境变量即可。
启动项目
npm run dev
打包项目
npm run build
整合ElementUI
npm install element-ui
引入Element
在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)
});
使用脚手架搭建vue项目的更多相关文章
- 利用VUE-CLI脚手架搭建VUE项目
前言 在学习完vue基础语法之后,学着利用vue-cli脚手架搭建一个项目,本篇随笔主要记录搭建的过程,供大家一起学习. 具体内容 搭建vue项目的准备工作 1.安装Nodejs.NPM以及VSCod ...
- 使用Vue CLI脚手架搭建vue项目
本次是使用@vue/cli 3.11.0版本搭建的vue项目 1. 首先确保自己的电脑上的Node.js的版本是8.9版本或者以上 2. 全局安装vue/cli npm install @vue/cl ...
- 使用node.js 脚手架搭建Vue项目
1.安装node.js https://nodejs.org/zh-cn/ 下载安装node.js 在命令行测试 node -v 输出版本号说明安装成功 2.使用npm更新安装cpnm npm ins ...
- 脚手架搭建vue项目
1.安装安装node.js: 2.cnpm install vue-cli -g (全局安装,需要注意的是我这里是用淘宝镜像安装的,没有安装cnpm的需要先去安装一下) 3.vue --version ...
- 让vue-cli脚手架搭建的项目可以处理vue文件中postcss语法
图中&属于postcss的语法,这样书写样式可以清楚的看出选择器之前的层级关系,非常好用. 在利用vue-cli脚手架搭建的项目中如果不配置是不支持这种写法的,这样写不会报错,但是样式不生效. ...
- 手把手教你用vue-cli搭建vue项目
手把手教你用vue-cli搭建vue项目 本篇主要是利用vue-cli来搭建vue项目,其中前提是node和npm已经安装好,文章结尾将会简单提到一个简单的例子.使用vue-cli搭建项目最开始我也是 ...
- 搭建vue项目环境
前言 在开发本项目之前,我对vue,react,angular等框架了解,仅限于知道它们是什么框架,他们的核心是什么,但是并没有实际使用过(angular 1.0版本用过,因为太难用,所以对这类框架都 ...
- element-ui和npm、webpack、vue-cli搭建Vue项目
一.element-ui的简单使用 1.安装 1. npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i element-ui -S 2. CDN ...
- 快速搭建Vue项目
快速搭建Vue项目 第一次安装vue项目Vue推荐开发环境Node.js 6.2.0.npm 3.8.9.webpack 1.13.vue-cli 2.5.1.webstrom2016 安装环境: 安 ...
随机推荐
- 解析MindMapper选项中的鱼骨选项
MindMapper思维导图可以画鱼骨图,而且完成的相当漂亮,我们可以在选项设置中定义鱼骨图图的默认样式.下面本文就分析了MindMapper选项中可以更改哪些鱼骨图设置. 我们首先打开MindMap ...
- 2021版的思维导图MindManager 安装激活以及换机教程
思维导图软件MindManager更新版本啦,相信细心的小伙伴应该已经发现了,MindManager最新版的名称变成了MindManager Windows 21,并且更新了很多新功能,点击查看Min ...
- CorelDRAW常用工具之涂抹工具
CDR作为绘图软件或者说平面设计软件使用频繁的功能之一,就是为绘制好的图片进行涂抹混色. 1.基本操作 CorelDRAW平面设计软件的涂抹工具是在形状工具组里的,打开左侧工具栏"形状&qu ...
- FL Studio中的音频剪辑功能讲解
音频剪辑,是FL Studio中的一个特色功能,音频剪辑的目的是保持在播放列表中显示和触发的音频,可以根据需要对它们进行切片和排列.但需要注意的是音频剪辑这个功能在FL Studio的基础版(果味版) ...
- 模拟赛38 B. T形覆盖 大模拟
题目描述 如果玩过俄罗斯方块,应该见过如下图形: 我们称它为一个 \(T\) 形四格拼板 .其中心被标记为\(×\). 小苗画了一个 \(m\) 行 \(n\) 列的长方形网格.行从 \(0\) 至 ...
- synchronized关键字的可重入性
/**父类*/public class SynchronizedDemo1 implements Runnable { @Override public void run() { try { meth ...
- iOS如何实现语音播报及后台播放
最近项目刚刚交付,偶然间用到了语音播报和语音搜索的功能.语音搜索我用的是讯飞的demo,感觉效果还不错,感兴趣的话可以去官网上面下载demo,里面讲的特别的详细,不过稍显麻烦一些.语音播报讯飞也有de ...
- Hibernate的配置跟简单创建一个表并插入一条数据
首先官网下载一个hibernate的架包,由于时间关系,博主已经分享到了百度网盘:https://pan.baidu.com/s/1Mw0Og3EKnouf84Njz9UicQ,提取码lens Hib ...
- ③SpringCloud 实战:使用 Ribbon 客户端负载均衡
这是SpringCloud实战系列中第三篇文章,了解前面第两篇文章更有助于更好理解本文内容: ①SpringCloud 实战:引入Eureka组件,完善服务治理 ②SpringCloud 实战:引入F ...
- LeetCode 025 Reverse Nodes in k-Group
题目描述:Reverse Nodes in k-Group Given a linked list, reverse the nodes of a linked list k at a time an ...