全局安装环境

安装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. 这个厉害了,ssm框架整合全过程,建议收藏起来好好看看

    1.0 环境要求 IDEA MySQL 5.7.19 Tomcat 9 Maven 3.6 1.1 数据库 创建书籍数据库表,包括书籍编号,书籍名称,书籍数量以及书籍描述. CREATE DATABA ...

  2. FL Studio录制面板作用介绍

    在上一节教程中我们详细的讲解了一下FL Studio录制面板菜单的一些功能,今天我们将继续讲解该面板的知识.具体内容小编这里就不多说了,还是一起来看看吧! 1.录音倒数.该按钮在打开的情况下会在录音前 ...

  3. 【VUE】6.组件通信(一)父组件向子组件传值

    1. 前提&知识点 1./components/Father.vue 是父组件, Son.vue 是子组件 2.父组件像子组件通信 props 2.组件通信 1. 新增一个路由入口 /fath ...

  4. jmeter多用户登录并发测试

    在使用Jmeter进行性能测试时,我们通常会需要配置多个不同用户进行并发测试,这里简单介绍一下配置方法. 1.运行Jmeter.bat,  在打开的测试计划中右键添加一个线程组: 2.在线程组下添加录 ...

  5. Leetcode1 - 10

    1. 两数之和 class Solution { public: vector<int> twoSum(vector<int>& nums, int target) { ...

  6. 程序媛数据报告:近三年增长至70%,平均月薪1.54W,女性程序媛并不是特殊物种

  7. 顺序结构(C语言基本结构)

    顺序结构 1.基本概念 语句执行的顺序与顺序程序书写的顺序一致 特点 a.程序执行的顺序和语句书写的顺序一致 b.有一个数据入口,一个数据出口 顺序结构与四则运算 顺序结构是C语言的基本结构 程序由上 ...

  8. 2. 三数之和(数组、hashset)

    思路及算法: 该题与第一题的"两数之和"相似,三数之和为0,不就是两数之和为第三个数的相反数吗?因为不能重复,所以,首先进行了一遍排序:其次,在枚举的时候判断了本次的第三个数的值是 ...

  9. nacos单机,集群安装部署

    nacos单机启动 准备 下载nacos安装包 下载地址 准备centos环境 (本次测试使用docker) PS C:\Users\Administrator> docker run -tid ...

  10. golang 自学系列(四)——debug for vscode

    golang 自学系列(四)--(调试)VSCode For Debug 这里如何装 vscode 我就不说了 这里如何在 vscode 正常写代码我也不说了 在能正常用 vscode 写 go 语言 ...