Vue-cli3 项目配置 Vue.config.js( 代替vue-cli2 build config)
Vue-cli3 搭建的项目 界面相对之前较为简洁
之前的build和config文件夹不见了,那么应该如何配置 如webpack等的配那
只需要在项目的根目录下新建 vue.config.js 文件(是根目录,不是src目录)
语法
module.exports = {
// 基本路径 baseURL已经过时
publicPath: './',
// 输出文件目录
outputDir: 'dist',
// eslint-loader 是否在保存的时候检查
lintOnSave: true,
// use the full build with in-browser compiler?
// https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only
// compiler: false,
// webpack配置
// see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
chainWebpack: () => {},
configureWebpack: () => {},
// vue-loader 配置项
// https://vue-loader.vuejs.org/en/options.html
// vueLoader: {},
// 生产环境是否生成 sourceMap 文件
productionSourceMap: true,
// css相关配置
css: {
// 是否使用css分离插件 ExtractTextPlugin
extract: true,
// 开启 CSS source maps?
sourceMap: false,
// css预设器配置项
loaderOptions: {},
// 启用 CSS modules for all css / pre-processor files.
modules: false
},
// use thread-loader for babel & TS in production build
// enabled by default if the machine has more than 1 cores
parallel: require('os').cpus().length > 1,
// 是否启用dll
// See https://github.com/vuejs/vue-cli/blob/dev/docs/cli-service.md#dll-mode
// dll: false,
// PWA 插件相关配置
// see https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
pwa: {},
// webpack-dev-server 相关配置
devServer: {
open: process.platform === 'darwin',
host: '0.0.0.0',//如果是真机测试,就使用这个IP
port: 1234,
https: false,
hotOnly: false,
proxy: null, // 设置代理
before: app => {}
},
// 第三方插件配置
pluginOptions: {
// ...
}
}
Vue.config.js配置跨域
devServer: {
open: true, //浏览器自动打开页面
host: "0.0.0.0", //如果是真机测试,就使用这个IP
port: 8911,
https: false,
hotOnly: false, //热更新(webpack已实现了,这里false即可)
proxy: {
//配置跨域
'/api': {
target: "http://192.168.234.237:8886/api",
ws:true,
changOrigin:true,
pathRewrite:{
'^/api':'/'
}
}
}
}
//调用
this.$http.get('/api/order/getOrder')
.then(res => {
console.log(res.data);
})
.catch(err => {
console.log(err.data.message);
});
Vue-cli3 项目配置 Vue.config.js( 代替vue-cli2 build config)的更多相关文章
- vue cli3 项目配置
[转]https://juejin.im/post/5c63afd56fb9a049b41cf5f4 基于vue-cli3.0快速构建vue项目 本章详细介绍使用vue-cli3.0来搭建项目. 本章 ...
- VUE前端项目配置代理解决跨域问题
VUE前端项目配置代理解决跨域问题 问题如下,经常在本地调试接口出现这种问题 解决方式1:Chrome 的扩展插件 以前使用Chrome 的扩展插件,但是有时候还是会出现莫名其妙的问题. 需要梯子才行 ...
- webpack.config.js和vue.config.js的区别
webpack.config.js是webpack的配置文件,所有使用webpack作为打包工具的项目都可以使用,vue的项目可以使用,react的项目也可以使用. vue.config.js是vue ...
- 关于自己配置有关webpack.config.js和vue项目搭建相关步骤
## Webpack的配置和使用 ### 安装 1. 全局安装 ``` npm install webpack -g ``` 2. 本地安装 ``` npm install webpack -D `` ...
- vue cli3项目发布在apache www/vue目录下并配置history路由
注意:vue项目打包后默认是指向服务器的根路径(比如apache默认www目录是根路径,当然也可以修改),这种情况不需要做路径的配置,只需要做history配置,如果不是发布到根路径而是www/vue ...
- Vue+webpack项目配置便于维护的目录结构
新建项目的时候创建合理的目录结构便于后期的维护是很重要 环境:vue.webpack 目录结构: 项目子目录结构 子目录结构都差不多,主要目录是在src下面操作 src目录结构 src/common ...
- Vue + webpack 项目配置化、接口请求统一管理
准备工作 需求由来: 当项目越来越大的时候提高项目运行编译速度.压缩代码体积.项目维护.bug修复......等等成为不得不考虑而且不得不做的问题. 又或者后面其他同事接手你的模块,或者改你的bug ...
- Vue基础项目配置
一,使用Vuejs搭建项目需要一些基础配置,这样能使的编程过程事半功倍 1.首先下载nodejs,然后使用nodejs使用NPM命令下载VueCli3.0以上的Vue脚手架.通过脚手架可以使用Vue ...
- vue 的rem 配置和flexible.js的应用
1.环境的配置: C:\Windows\System32\drivers\etc 2.多行注释: 光标放在函数中间,连按两次:“Ctrl+Alt+D”,就会出现以下的内容 3.总结使用过程:vue移动 ...
- Vue创建项目配置
前言 安装VS Code,开始vue的学习及编程,但是总是遇到各种各样的错误,控制台语法错误,格式错误.一股脑的袭来,感觉创建个项目怎么这个麻烦.这里就讲一下vue的安装及创建. 安装环境 当然第一步 ...
随机推荐
- 0级搭建类006-Oracle Solaris 安装 (10.13) 公开
项目文档引子系列是根据项目原型,制作的测试实验文档,目的是为了提升项目过程中的实际动手能力,打造精品文档AskScuti. 项目文档引子系列目前不对外发布,仅作为博客记录.如学员在实际工作过程中需提前 ...
- Java参数传递是值传递还是引用传递?
当一个对象被当作参数传递到一个方法后,在此方法内可以改变这个对象的属性,那么这里到底是值传递还是引用传递? 答:是值传递.Java 语言的参数传递只有值传递.当一个实例对象作为参数被传递到方法中时,参 ...
- 假期学习【三】HDFS操作及spark的安装/使用
1.安装 Hadoop 和 Spark 进入 Linux 系统,参照本教程官网“实验指南”栏目的“Hadoop 的安装和使用”,完 成 Hadoop 伪分布式模式的安装.完成 Hadoop 的安装以后 ...
- BZOJ2190 SDOI2008 仪仗队 gcd,欧拉函数
题意:求从左下角能看到的元素个数 引理:对点(x,y),连线(0,0)-(x,y),元素个数为gcd(x,y)-1(中间元素) 即要求gcd(x,y)=1 求gcd(x,y)=1的个数 转化为2 \s ...
- RN开发-ReactJS组件
虚拟DOM :将真实的DOM结构虚拟成json类型数据 props : 不可改变,用于数据传递 state : 组件属性,主要用来存储组件自身需要的数据,每次改变都会引起组件的更新 ...
- Linux断网安装jdk1.8
1.创建目录存放jdk包 mkdir /usr/java 2.上传jdk包 通过xftp或者其他远程工具 3.解压jdk tar zxvf jdk-8u221-linux-x64.tar.gz 4.打 ...
- Hackintosh相关资源站
猫叔博客 https://www.maoshu.cc/ 大神RehabMan https://bitbucket.org/RehabMan/ dsdt/ssdt打补丁译文 https://blog.c ...
- int*v=newint[src.cols*4]
在学习:使用OpenCV2.x计算图像的水平和垂直积分投影中,有下图一种代码: 对比上面两个代码对于同一张图片求得的结果会发现不同: 为什么会出现这个原因呢?不知道为啥这样初始化? 首先查看一下图片深 ...
- Python常用的类库、对应的方法和属性
Python常用的类库.对应的方法和属性
- 题解【洛谷P1983】[NOIP2013]车站分级
题面 题解 不难想到拓扑排序 于是每一个等级高的向等级低的连一条边 考虑拓扑排序过程中的分层 对于每个点进行分层 于是答案就是这些点中的最大层数 然后就会RE 发现我们多连了一些重复的边 用一个标记数 ...