关于vue-cli的安装
(一):*安装 vue-cli
参考:
https://cn.vuejs.org/v2/guide/installation.html
https://github.com/vuejs/vue-cli
全局安装:
npm install vue-cli -g 或者 npm install -g @vue/cli-init
cd到某文件夹下初始化:
cd ./vue_app
vue init webpack project_one(目录名称)
初始化配置一些信息:
通常: y/n y
eslint y/n n
jest y/n n
e2e y/n n
项目构建完成
开发环境中运行在本地 8080:
cd project_one
npm dev
localhost:8080 浏览器访问
(二):*上线前的打包(打包成静态文件,html,css,js)
npm run build
根目录下创建了dist文件夹,包含index.html和static文件夹
终端提示:
(Build complete.
Tip: built files are meant to be served over an HTTP server.
Opening index.html over file:// won't work.)
意思是:构建文件务必放在一个HTTP服务器。直接打开index.html文件将不工作。
解决方式:
方法一:修改 ./config/index.js文件,
将build.assetsPublicPath: '/'修改成build.assetsPublicPath: './'
方法二:将dist文件部署到服务器环境即可运行
关于vue-cli的安装的更多相关文章
- vue cli的安装与使用
一.简介 vue作为前端开发的热门工具,受到前端开发人员的喜爱.为了简化项目的构建,采用vue cli来简化开发. vue cli是一个全局安装的npm包,提供了终端使用的命令.vue create可 ...
- Vue CLI 介绍安装
https://cli.vuejs.org/zh/guide/ 介绍 警告 这份文档是对应 @vue/cli 3.x 版本的.老版本的 vue-cli 文档请移步这里. Vue CLI 是一个基于 V ...
- Vue Cli安装以及使用
因为公司项目要用vue框架,所以会用vue-cli来新建项目.用过vue的都知道,要全局安装vue以及脚手架vue-cli,然后执行vue init webpack projectname来新建v ...
- 【Vue CLI】从安装到构建项目再到目录结构的说明
目录 1. 构建我们的项目 2. 目录结构说明 2.1 build目录 2.2 config目录 2.3 src目录 2.4 static目录 "Vue CLI是一个基于Vue.js进行快速 ...
- [转]Vue CLI 3搭建vue+vuex 最全分析
原文地址:https://my.oschina.net/wangnian/blog/2051369 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@ ...
- vue cli创建typescript项目
使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...
- 使用vue/cli 创建一个简单的项目
首先,电脑安装了node.js官方要求8.9 或更高版本 (推荐 8.11.0+) npm install -g @vue/cli # OR yarn global add @vue/cli 全局安装 ...
- Vue CLI 3搭建vue+vuex 最全分析
一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cli 全局安装的 npm 包,提供了终端里的vue命令(如:vue create .vue ...
- 13. Vue CLI脚手架
一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...
- 基于vue cli 3.0创建前端项目并安装cube-ui
前提条件: 安装node.js. 国内的开发者最好先配置淘宝镜像. 之后用cnpm来代替npm命令. 项目创建过程: 打开cmd,输入命令进入目标工作空间,以本机项目为例: cd /d d: cd D ...
随机推荐
- 修改Linux系统的默认语言编码集
RedHat 今天晚上发现服务器上vi的界面提示变成了乱码,只能将XShell的编码改为GBK才能正常显示,导致consolas字体无法使用,GBK编码下的字体丑陋无比,无法忍受,一轮google之后 ...
- 安全工具推荐之sqlmap tamper&sqlmap api
我发现总有一些人喜欢问sqlmap的tamper脚本,问完工具问参数,问完参数问脚本...... 你这个问题问的水平就很艺术,让我一时不知从何说起...... 说一下在sqlmap的使用过程中,个人了 ...
- Mysql报错注入之floor报错详解
一.简述 利用 select count(*),(floor(rand(0)*2))x from table group by x,导致数据库报错,通过 concat 函数,连接注入语句与 floor ...
- linux ftp ubuntu18.04 实测有效 完整方法 vsftpd
https://linuxize.com/post/how-to-setup-ftp-server-with-vsftpd-on-ubuntu-18-04/ 除了此链接完整有效,其他网友 大都残缺不全 ...
- 启动Django报错:SyntaxError: Generator expression must be parenthesized 解决办法
这是因为版本不兼容所导致的. 此错误已知与Python问题#32012相关.基于Django 1.11.16及以下的项目将在Python 3.7启动时引发此异常.此问题的补丁已合并到Django 2. ...
- LuoguP3167通配符匹配
题意 本题的意思就是给出一段带有 $ ? $ 与 \(*\) 的字符串 (在下面称为\(s\)), $ ? $ 必须占据一个字符位置, \(*\) 可以占据任意位置, 求下面给出几段(在下面称为\(s ...
- SpringCache(redis)
pom <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spr ...
- 【springboot】过滤器、监听器、拦截器,Aspect切片
转自: https://blog.csdn.net/cp026la/article/details/86501019 简介: 本章介绍拦截器.过滤器.切片对请求拦截的使用与区别,以及监听器在 spri ...
- WPF---依赖属性(一)
一.概要 C#中属性是抽象模型的核心部分,而依赖属性是专门针对WPF的. 在WPF库实现中,依赖属性使用普通的C#属性进行了包装,使得我们可以通过和以前一样的方式来使用依赖属性. 依赖属性优点如下: ...
- Linux 安装配置 NET模式网络环境配置
1.下载linux:发行版 Ubuntu REdHat centos Debain Fedora,SUSE,OpenSUSEcentos 6.xcentos 7.x在虚拟机(VmWare)上 安装l ...