全局安装环境

安装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. 转换文件格式遭遇 FileNotFoundError:[WinError 2]系统找不到指定的文件

    重启试试

  2. ServiceStage-华为微服务开发与管理平台

    前言 在上一篇文章一年前,我来到国企搞IT 中,和小伙伴分享了我在国企这一年当中的所见,所闻,所想,很高兴能够获得很多同道中人的共鸣.过去一年,我的很大一部分工作都投入到公司技术平台的建设中.Jira ...

  3. leetcode187. 重复的DNA序列

    所有 DNA 都由一系列缩写为 A,C,G 和 T 的核苷酸组成,例如:"ACGAATTCCG".在研究 DNA 时,识别 DNA 中的重复序列有时会对研究非常有帮助.编写一个函数 ...

  4. 《图解TCP/IP》第四章

    <图解TCP/IP>第四章 4.1 IP 即网际协议 4.1.1 IP(IPv4.IPv6)相当于OSI参考模型中的第3层-网络层 4.1.2 数据链路层和网络层的关系: 数据链路层的主要 ...

  5. canvas 元素覆盖&穿透问题

    给网站添加canvas动态背景.完后发现有a标签无法点击,想到是canvas覆盖了(但有些是可以的).网上查找,有解决穿透的问题,但canvas的鼠标事件会无效.后发现是定位问题. canvas样式 ...

  6. Java基础教程——多态

    直观地说,多态就是"一个对象,多种形态 ".比如观世音菩萨就有多种形态-- 每个人都有多种形态-- 具体地讲,多态是指"同一个对象.同一个方法(函数),表现出不同的行为& ...

  7. 小米死磕硬核技术,将扩招5000名工程师,多个领域会使用到C++

    小米MIDC大会2020在北京小米科技园召开,小米集团创始人.集团董事长兼CEO雷军宣布:"重视人才队伍的建设.人才是创新之源,提升技术实力的第一步,就是聚拢最顶尖的人才.小米2021年将在 ...

  8. 编程语言输出“ Hello World ”,你真的都会了吗?

    Hello World 中文意思是『你好,世界』.因为<The C Programming Language>中使用它做为第一个演示程序,非常著名,所以后来的程序员在学习编程或进行设备调试 ...

  9. LeetCode 042 Trapping Rain Water

    题目要求:Trapping Rain Water Given n non-negative integers representing an elevation map where the width ...

  10. 「考试」联赛模拟36-39,noip晚间小测2-3

    36.1 party(CF623D) 很是鸡贼的一道题 首先要明确一点,抓人是有策略,而不是随机的,可以认为等同于按一个给定的顺序猜人,那么这时猜中的概率就只是抓住这个人的概率了 对于每一次猜测,因为 ...