1.安装node.js

  从node官网下载并安装node,安装步骤很简单,只要一路“next”就可以了。

2.安装cnpm 淘宝镜像

npm install -g cnpm --registry=https://registry.npm.taobao.org

3.安装vue

cnpm install vue

4.安装脚手架

cnpm install --global vue-cli

5.新建一个项目

vue init webpack 项目名称
运行初始化命令的时候回让用户输入几个基本的选项,如项目名称,描述,作者等信息,如果不想填直接回车默认就好。

5.运行和打包

cnpm run dev 会输出一个地址,一般是localhost:8080,在浏览器运行这个地址就可以跑起来了
打包 npm run build 看到提示build complete 说明打包完成 ,打包完成后会多出一个dist文件夹,把这个文件夹上传到服务器及可
(打包前注意将index.js下面的assetsPublicPath: '/'改成assetsPublicPath: './'




 
 

vue脚手架安装,新建项目,打包的更多相关文章

  1. vue 脚手架搭建新项目以及element-ui等vue组件的使用

    vue快速搭建项目(前提是你的电脑已经安装了node的环境和vue脚手架安装,不会的自行百度) 1:打开终端: 这里说下此时位置是在User下的lijuntao文件夹下面,我一般会在桌面新建一个文件夹 ...

  2. 08 . Vue脚手架安装,使用,自定义配置和Element-UI导入使用

    Vue脚手架 Vue脚手架可以快速生成Vue项目基础的架构. 安装3.x版本的Vue脚手架 /* npm install -g @vue/cli@3.3 */ 基于3.3版本的脚手架命令创建Vue项目 ...

  3. 用vue脚手架创建bootstrap-vue项目

    用vue脚手架创建bootstrap-vue项目 框架的地址:https://bootstrap-vue.js.org/docs/ 第一步 vue init webpack demo第二步 cd de ...

  4. npm安装使用及vue脚手架安装

    公司在前端用vue开发项目,那就学习下啦,第一步,在安装vue-devtools过程中,npm作为官方manual installtion方式,肯定必不可少. NPM是随同NodeJS一起安装的包管理 ...

  5. vue开发搭建(npm安装 + vue脚手架安装)

    一.概念 1.npm:  Nodejs下的包管理器. 2.webpack: 它主要的用途是通过CommonJS的语法,把所有浏览器端需要发布的静态资源,做相应的准备,比如资源的合并和打包. 3.vue ...

  6. vue手脚架安装和项目创建

    一 node安装 1 如果不确定自己是否安装了node,可以在命令行工具内执行:node -v: 2如果执行结果显示:xx不是内部命令,说明你还没有安装node,node按爪给你地址 : http:/ ...

  7. vue2.0:(一)、vue的安装和项目搭建(以外卖app项目举例)

    vue系列踩坑大作战由此就要开始了,准备好了吗,和我一起踩坑,学会vue吧.同时,也欢迎大家把自己遇到的坑发出来,让更多的人学会vue,因为我深知前端学习新框架不容易,尤其是我这种半路出家的女前端.不 ...

  8. Vue -- vue-cli(vue脚手架) npm run build打包优化

    这段时间公司新项目立项,开发组选用 Vue2.0 进行开发.当然也就一并用到 vue cli 进行自动化构建.结果在基础版本开发完成后,用 npm run build 命令打包上线时,发现以下几个问题 ...

  9. idea新建项目打包 ,运行jar,并放入maven仓库

    1.新建项目(转自:http://www.cnblogs.com/wql025/p/5215570.html) 创建一个新Maven项目 new 一个project 不选择任何Maven模板 起个Gr ...

随机推荐

  1. UiPath之文件操作

    今天给大家介绍一下,在UiPath中如何操作文件,比如需要在某个文件夹中自动创建一个当天日期的文本. 主要使用的activity有: l  Assign l  Path Exists l  If l  ...

  2. Docker 开篇2 | 树莓派安装docker 续

    问题1:安装后出现错误Error! The dkms.conf for this module includes a BUILD_EXCLUSIVE directive which does not ...

  3. 邵国际: C 语言对象化设计实例 —— 命令解析器

    本文系转载,著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 作者: 邵国际 来源: 微信公众号linux阅码场(id: linuxdev) 内容简介 单片机工程师常常疑惑为什么 ...

  4. MySQL系列:一句SQL,MySQL是怎么工作的?

    对于MySQL而言,其实分为客户端与服务端. 服务端,就是MySQL应用,当我们使用net start mysql命令启动的服务,其实就是启动了MySQL的服务端. 客户端,负责发送请求到服务端并从服 ...

  5. Linux跨网段通信小实验

    一.实验场景. 实验准备,Linux主机4台.分别是主机A,路由主机R1,路由主机R2,主机 C,主机A的ip是192.168.56.66/24,且只有一块网卡eth0:路由主机R1有两块网卡eth0 ...

  6. 如何给HTML标签中的文本设置修饰线

    text-decoration属性介绍 text-decoration属性是用来设置文本修饰线呢,text-decoration属性一共有4个值. text-decoration属性值说明表 值 作用 ...

  7. ASP.NET Core 1.0: API的输入参数

    Web API是需要接受参数的,譬如,通常用于创建数据的POST method需要接受输入数据,而用于GET method也需要接受一些可选参数,譬如:为了性能起见,控制返回数据的数量是至关重要的. ...

  8. hdu 1251 统计难题 (字典树(Trie)<PS:C++提交不得爆内存>)

    统计难题Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 131070/65535 K (Java/Others)Total Submis ...

  9. 领扣(LeetCode)检测大写字母 个人题解

    给定一个单词,你需要判断单词的大写使用是否正确. 我们定义,在以下情况时,单词的大写用法是正确的: 全部字母都是大写,比如"USA". 单词中所有字母都不是大写,比如"l ...

  10. django_4数据库3——admin

    生成admin界面 1.setting.py中,保证'django.contrib.admin',应用打开,django1.11默认打开的 2.url.py中的admin默认时打开的 3.对model ...