vue-cli3.0相对比vue-cli2.0少了 vue-build.js vue-config.js

vue-cli2.0 运行命令 npm run dev
vue-cli3.0 运行命令 npm run serve

vue-cli3.0 要自己在项目根目录下配置 vue-config.js

vue-cli3.x 新特性及踩坑记


module.exports = {
// baseUrl type:{string} default:'/'
// 将部署应用程序的基本URL
// 将部署应用程序的基本URL。
// 默认情况下,Vue CLI假设您的应用程序将部署在域的根目录下。
// https://www.my-app.com/。如果应用程序部署在子路径上,则需要使用此选项指定子路径。例如,如果您的应用程序部署在https://www.foobar.com/my-app/,集baseUrl到'/my-app/'. baseUrl: './', // outputDir: 在npm run build时 生成文件的目录 type:string, default:'dist' outputDir: 'dist', // pages:{ type:Object,Default:undfind }
/*
构建多页面模式的应用程序.每个“页面”都应该有一个相应的JavaScript条目文件。该值应该是一
个对象,其中键是条目的名称,而该值要么是指定其条目、模板和文件名的对象,要么是指定其条目
的字符串,
注意:请保证pages里配置的路径和文件名 在你的文档目录都存在 否则启动服务会报错的
*/
// pages: {
// index: {
// entry for the page
// entry: 'src/index/main.js',
// the source template
// template: 'public/index.html',
// output as dist/index.html
// filename: 'index.html'
// },
// when using the entry-only string format,
// template is inferred to be `public/subpage.html`
// and falls back to `public/index.html` if not found.
// Output filename is inferred to be `subpage.html`.
// subpage: 'src/subpage/main.js'
// }, // lintOnSave:{ type:Boolean default:true } 问你是否使用eslint
lintOnSave: true,
// productionSourceMap:{ type:Bollean,default:true } 生产源映射
// 如果您不需要生产时的源映射,那么将此设置为false可以加速生产构建
productionSourceMap: false,
// devServer:{type:Object} 3个属性host,port,https
// 它支持webPack-dev-server的所有选项 devServer: { port: 8085, // 端口号
host: 'localhost',
https: false, // https:{type:Boolean}
open: true, //配置自动启动浏览器
// proxy: 'http://localhost:4000' // 配置跨域处理,只有一个代理
proxy: {
'/api': {
target: 'https://apiv2.pinduoduo.com',
ws: true,
changeOrigin: true
},
'/foo': {
target: '<other_url>'
}
}, // 配置多个代理
}
}

vue在用HBuilder打包后 app启动一片空白 3.0里面的baseUrl 改成 baseUrl: './'

如果你安装了vue-cli3.0却要用cli2.0的话那么你需要全局安装一个桥接工具 npm install -g @vue/cli-init
另外使用HBuilder将项目打包的时候发现自己的接口里面的数据请求不到,其它静态资源正常显示。那是因为在开发阶段浏览器需要解决跨域问题使用了反向代理,如果打包app需要将代理注释,axios请求地址改为绝对路径

原文地址:https://segmentfault.com/a/1190000016964485

vue-cli3.0相关的坑的更多相关文章

  1. vue cli3.0 结合echarts3.0和地图的使用方法

    echarts 提供了直观,交互丰富,可高度个性化定制的数据可视化图表.而vue更合适操纵数据. 最近一直忙着搬家,就没有更新博客,今天抽出空来写一篇关于vue和echarts的博客.下面是结合地图的 ...

  2. 解决vue/cli3.0 语法验证规则 ESLint: Expected indentation of 2 spaces but found 4. (indent)

    当你使用vue/cli3.0的时,有可能出现雁阵规则 ESLint: Expected indentation of 2 spaces but found 4. (indent) 解决方法 1.在vu ...

  3. 01-路由跳转 安装less this.$router.replace(path) 解决vue/cli3.0语法报错问题

    2==解决vue2.0里面控制台包的一些语法错误. https://www.jianshu.com/p/5e0a1541418b 在build==>webpack.base.conf.j下注释掉 ...

  4. vue cli3.0打包

    1.vue cli3.0需要在项目根目录下配置webpack  包括反向代理以及打包文件路径 const webpack = require("webpack"); module. ...

  5. 使用VUE CLI3.0搭建项目vue2+scss+element简易版

    1.安装Vue CLI 3 //三选一即可cnpm install -g @vue/cli npm install -g @vue/cli yarn global add @vue/cli 注意: 1 ...

  6. vue cli3.0配制axios代理

    今天学习时,想访问网易新闻接口,结果显而易见,因为跨域被浏览器拒绝了. 去网上找一下结果一开始找到的是2.x版本的配置,生硬的放进去,给我各种报错.编译阶段就炸了.浪费好多时间 再按3.0版本去搜索才 ...

  7. vue cli3.0快速搭建项目详解(强烈推荐)

    这篇文章主要介绍下vue-cli3.0项目搭建,项目结构和配置等整理一下,分享给大家. 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cl ...

  8. vue cli3.0使用svg全过程

    VUE-cli3使用 svg-sprite-loader svg-sprite-loader 的插件,用来根据导入的 svg 文件自动生成 symbol 标签并插入 html 1.安装依赖 npm i ...

  9. vue cli3.0 首次加载优化

    项目经理要求做首页加载优化,打包后从十几兆优化到两兆多,记下来怕下次忘记 运行report脚本 可看到都加载了那些内容,在从dist文件中index.html 查看首次加载都加载了那些东西,如下图:然 ...

随机推荐

  1. [Android]XML和JSON的区别

    1.定义介绍 (1).XML定义 扩展标记语言 (Extensible Markup Language, XML) ,用于标记电子文件使其具有结构性的标记语言,可以用来标记数据.定义数据类型,是一种允 ...

  2. jQuery背景插件backstretch使用指南

    http://www.bkjia.com/Javascript/987917.html

  3. Net Core 2.0 Redis

    Net Core 2.0 Redis配置.封装帮助类RedisHelper及使用实例 https://www.cnblogs.com/oorz/p/9052498.html 本文目录 摘要 Redis ...

  4. Java8中的新特性Optional

    Optional 类是一个可以为null的容器对象.如果值存在则isPresent()方法会返回true,调用get()方法会返回该对象.Optional 是个容器:它可以保存类型T的值,或者仅仅保存 ...

  5. @Slf4j注解的使用

    项目中使用Slf4j日志: private static final Logger log=LoggerFactory.getLogger(TestMain.class); 使用@Slf4j以后,默认 ...

  6. 066 Plus One

    给定一个非负整数组成的非空数组,给整数加一.可以假设整数不包含任何前导零,除了数字0本身.最高位数字存放在列表的首位.详见:https://leetcode.com/problems/plus-one ...

  7. ecshop分类页把分类描述改成FCKeditor编辑器

    最近放一个网站 http://www.macklin.cn/productline/35 有个产品分类页面需要添加分类缩略图和图文的描述 一.首先说下添加分类缩略图的步骤吧 1,依葫芦画瓢,参照的是e ...

  8. sqlserver 查询某表的所有列名

    select name + ',' from syscolumns where id = object_id('SEND_TALLY') AND name <> 'PICDATAS'

  9. ssh免密登录配置方法

    方法一 1.#ssh-keygen -t rsa 在客户端生成密钥对 把公钥拷贝给要登录的目标主机, 目标主机上将这个公钥加入到授权列表 #cat id_rsa.pub >> author ...

  10. C#调用SAP S4/HANA Gateway Service

    公司使用SAP,并且实施公司做了一些提供报表数据的接口供调用,首先说明一下我对SAP不熟悉 但SAP用到的接口信息提供大家参考一下,这些Gateway Service使用的是DCP方式写的,SAP提供 ...