全局安装环境

安装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项目的更多相关文章

  1. 利用VUE-CLI脚手架搭建VUE项目

    前言 在学习完vue基础语法之后,学着利用vue-cli脚手架搭建一个项目,本篇随笔主要记录搭建的过程,供大家一起学习. 具体内容 搭建vue项目的准备工作 1.安装Nodejs.NPM以及VSCod ...

  2. 使用Vue CLI脚手架搭建vue项目

    本次是使用@vue/cli 3.11.0版本搭建的vue项目 1. 首先确保自己的电脑上的Node.js的版本是8.9版本或者以上 2. 全局安装vue/cli npm install @vue/cl ...

  3. 使用node.js 脚手架搭建Vue项目

    1.安装node.js https://nodejs.org/zh-cn/ 下载安装node.js 在命令行测试 node -v 输出版本号说明安装成功 2.使用npm更新安装cpnm npm ins ...

  4. 脚手架搭建vue项目

    1.安装安装node.js: 2.cnpm install vue-cli -g (全局安装,需要注意的是我这里是用淘宝镜像安装的,没有安装cnpm的需要先去安装一下) 3.vue --version ...

  5. 让vue-cli脚手架搭建的项目可以处理vue文件中postcss语法

    图中&属于postcss的语法,这样书写样式可以清楚的看出选择器之前的层级关系,非常好用. 在利用vue-cli脚手架搭建的项目中如果不配置是不支持这种写法的,这样写不会报错,但是样式不生效. ...

  6. 手把手教你用vue-cli搭建vue项目

    手把手教你用vue-cli搭建vue项目 本篇主要是利用vue-cli来搭建vue项目,其中前提是node和npm已经安装好,文章结尾将会简单提到一个简单的例子.使用vue-cli搭建项目最开始我也是 ...

  7. 搭建vue项目环境

    前言 在开发本项目之前,我对vue,react,angular等框架了解,仅限于知道它们是什么框架,他们的核心是什么,但是并没有实际使用过(angular 1.0版本用过,因为太难用,所以对这类框架都 ...

  8. element-ui和npm、webpack、vue-cli搭建Vue项目

    一.element-ui的简单使用 1.安装 1. npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i element-ui -S 2. CDN ...

  9. 快速搭建Vue项目

    快速搭建Vue项目 第一次安装vue项目Vue推荐开发环境Node.js 6.2.0.npm 3.8.9.webpack 1.13.vue-cli 2.5.1.webstrom2016 安装环境: 安 ...

随机推荐

  1. FTP漏洞利用复现

    目录 FTP弱口令漏洞 FTP后门漏洞利用 FTP弱口令漏洞 漏洞描述 FTP弱口令或匿名登录漏洞,一般指使用FTP的用户启用了匿名登录功能,或系统口令的长度太短.复杂度不够.仅包含数字.或仅包含字母 ...

  2. 通过shodan搜索相同favicon.ico的网站

    0x01 根据favicon.ico生成hash python2,想改python3折腾了半天不得 import mmh3 import requests response = requests.ge ...

  3. 插件Spire.PDF帮你高效搞定PDF打印

    Spire.PDF介绍 Spire.PDF是一个专业的PDF组件,能够独立地创建.编写.编辑.操作和阅读PDF文件,支持 .NET.Java.WPF和Silverlight.Spire.PDF的PDF ...

  4. ABBYY FineReader 15 新增编辑表格单元格功能

    ABBYY FineReader 15(Windows系统)新增编辑表格单元格功能,在PDF文档存在表格的前提下,可将表中的每个单元格作为单独的文字块进行单独编辑,单元格内的编辑不会影响同一行中其他单 ...

  5. 使用Mac清理工具CleanMyMac对Mac电脑进行维护

    CleanMyMac是Mac系统下的一款苹果电脑清理软件,同时也是一款优秀的电脑维护软件,它能通过用户手动运行CleanMyMac内置脚本文件,释放电脑内存,帮助电脑缓解卡顿现象,保证电脑的良好持续运 ...

  6. 如何使用ABBYY FineReader处理文档图像的缺陷?

    通过扫描仪或者数码相机获取的图像文件,容易出现文本扭曲.页面歪斜等缺陷,会影响到OCR的识别质量.此时,用户可使用ABBYY FineReader 15(Windows系统)OCR文字识别软件的自动和 ...

  7. css3系列之box-sizing

    box-sizing box-sizing: 俗称ie6 的混杂模式的盒子模型.  首先来了解一下 ie6 的混杂模式,和我们常用的 盒子模型有什么不一样 正常模式下: 我们设置的 width  和  ...

  8. k8s内网安装部署(二)

    续上篇 https://www.cnblogs.com/wangql/p/13397034.html 一.kubeadm安装 1.kube-proxy开启ipvs的前置条件 modprobe br_n ...

  9. sentinel整合servlet

    <dependency> <groupId>com.alibaba.csp</groupId> <artifactId>sentinel-web-ser ...

  10. CSRF&SSRF-初探准备

    了解CSRF之前的必备知识 1.同源策略 同源策略-三个相同:协议.域名.端口 举例说明: 源URL为:http://www.example.com/dir/page.html 协议为:http 域名 ...