vue-cli2和3中的config
最近在网上找了个vue搭建的后台管理的框架,在使用的时候发现没有了config和build文件夹,所以当时就蒙圈了,以为是作者自己改了什么东西,所以感觉自己不知道从何下手了,不过通过查资料发现原来是vue-cli2和3的config不相同,vue-cli3更加简洁了而已,vue.config.js是自己根据自己的需求新建的文件,开始是没有的。
所以自己开始各种查资料去了解vue-cli3的vue.config.js中的配置项,最后总结下来的
- 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 => {}
- },
pages: {
index: {
// page 的入口
entry: 'src/index/main.js',
// 模板来源
template: 'public/index.html',
// 在 dist/index.html 的输出
filename: 'index.html',
// 当使用 title 选项时,
// template 中的 title 标签需要是 <title><%= htmlWebpackPlugin.options.title %></title>
title: 'Index Page',
// 在这个页面中包含的块,默认情况下会包含
// 提取出来的通用 chunk 和 vendor chunk。
chunks: ['chunk-vendors', 'chunk-common', 'index']
},
// 当使用只有入口的字符串格式时,
// 模板会被推导为 `public/subpage.html`
// 并且如果找不到的话,就回退到 `public/index.html`。
// 输出文件名会被推导为 `subpage.html`。
subpage: 'src/subpage/main.js'
}
- // 第三方插件配置
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-cli2和3中的config的更多相关文章
- Vue cli2.0 项目中使用Monaco Editor编辑器
monaco-editor 是微软出的一条开源web在线编辑器支持多种语言,代码高亮,代码提示等功能,与Visual Studio Code 功能几乎相同. 在项目中可能会用带代码编辑功能,或者展示代 ...
- vue 单页应用中微信支付的坑
vue 单页应用中微信支付的坑 标签(空格分隔): 微信 支付 坑 vue 场景 在微信H5页面(使用 vue-router2 控制路由的 vue2 单页应用项目)中使用微信 jssdk 进行微信支付 ...
- vue/cli2.0优化
vue/cli2.0 脚手架 在项目写完了之后, 运行npm run build --report可以看出这个项目的资源占比情况.可以看出整个项目哪一个资源在整个项目占比最大.它会自动打开一个可视化的 ...
- [Vue CLI 3] 插件开发中的 genCacheConfig 细节研究
在 @vue/cli-plugin-babel/index.js 中: api.genCacheConfig('babel-loader', {}, []) 我们看一下 api.genCacheCon ...
- 在.net中读写config文件的各种方法
阅读目录 开始 config文件 - 自定义配置节点 config文件 - Property config文件 - Element config文件 - CDATA config文件 - Collec ...
- avalon 中require.config源码分析
/********************************************************************* * 配置系统 在系统运行的开始就需要读取系统中requir ...
- 如何在vue单页应用中使用百度地图
作为一名开发人员,每次接到开发任务,我们首先应该先分析需求,然后再思考技术方案和解决方案.三思而后行,这是一个好的习惯. 需求:本项目是采用vue组件化开发的单页应用项目,现需要在项目中引入百度的地图 ...
- 基于vue项目的组件中导入mui框架初始化滑动等效果时需移除严格模式的问题
基于vue项目的组件中导入mui框架初始化滑动等效果时,控制台报错:Uncaught TypeError: 'caller', 'callee', and 'arguments' properties ...
- vue 如何在循环中绑定v-model
vue 如何在循环中绑定v-model 我现在有这么一个需求,页面上有多项输入框,但是具体有多少项,我也不知道,它是通过"新增一项"按钮点击事件,点击一下,就新增一项:如下图这个样 ...
- Asp.net中web.config配置文件详解(一)
本文摘自Asp.net中web.config配置文件详解 web.config是一个XML文件,用来储存Asp.NET Web应用程序的配置信息,包括数据库连接字符.身份安全验证等,可以出现在Asp. ...
随机推荐
- 将python项目.py文件打包成.exe文件
安装pyinstaller包 pip3 install pyinstaller 如果不行 pip3 install pyinstaller -i https://pypi.doubanio.com/s ...
- EasyUI前后端分离
陈旧的开发模式 美工(ui工程师:出一个项目模型) java工程师:将原有的html转成jsp,动态展示数据 缺点: 客户需要调节前端的展示效果 解决:由美工去重新排版,重新选色.Vs前后端分离 美工 ...
- windows下socket编程实现client和server双向通信
服务端代码server.c // server.cpp : Defines the entry point for the console application. // #include <s ...
- 第02组 Alpha冲刺(1/4)
队名:十一个憨批 组长博客 作业博客 组长黄智 过去两天完成的任务:进行组员分工 GitHub签入记录 接下来的计划:构思游戏实现 还剩下哪些任务:敲代码 燃尽图 遇到的困难:任务分配的不及时,导致很 ...
- matplotlib 柱状图
222 # coding utf-8 # import matplotlib import numpy as np import matplotlib.pyplot as plt import mat ...
- haproxy 配置文件详解 之 defaults
配置示例: defaults mode http retries timeout connect 10s timeout client 20s timeout server 30s timeout c ...
- .net项目发布到iis
参考: https://www.cnblogs.com/teyigou/p/8125379.html https://www.cnblogs.com/kissfu/p/6399472.html htt ...
- 【cf比赛记录】Educational Codeforces Round 78 (Rated for Div. 2)
比赛传送门 A. Shuffle Hashing 题意:加密字符串.可以把字符串的字母打乱后再从前面以及后面接上字符串.问加密后的字符串是否符合加密规则. 题解:字符串的长度很短,直接暴力搜索所有情况 ...
- docker:轻量级图形页面管理工具Portainer
1.介绍 docker 图形化管理提供了很多工具,有Portainer.Docker UI.Shipyard等等,本文主要介绍Portainer. Portainer是一个开源.轻量级Docker管理 ...
- Tarjan 算法求 LCA / Tarjan 算法求强连通分量
[时光蒸汽喵带你做专题]最近公共祖先 LCA (Lowest Common Ancestors)_哔哩哔哩 (゜-゜)つロ 干杯~-bilibili tarjan LCA - YouTube Tarj ...