1.检查本机vue版本

vue -V

2.升级vue3.0命令

npm install -g @vue/cli

3.创建完项目后,在项目根目录新增vue.config.js文件,插入代码(简洁)

 module.exports = {
runtimeCompiler: true, //是否使用包含运行时编译器的 Vue 构建版本
publicPath: '',
productionSourceMap: false, //不在production环境使用SourceMap
devServer: {
//跨域
port: 9527, // 端口号
open: true, //配置自动启动浏览器
proxy: {
// 配置跨域处理 可以设置多个
'/api': {
target: 'xxxx',
ws: true,
changeOrigin: true
}
}
}
}

4.设置scss/sass全局变量

 module.exports = {
// ...
css: {
loaderOptions: {
sass: {
data: `
@import "@/assets/styles/_variable.scss"; // 路径自配
`
}
}
}
}

官网配置地址:https://cli.vuejs.org/zh/config/#vue-config-js

需要注意的是,baseUrl从 Vue CLI 3.3 起已弃用,需要使用publicPath

VUE3.0升级与配置(跨域、全局scss变量等)的更多相关文章

  1. vue-cli 3.0 使用axios配置跨域访问豆瓣接口

    vue-cli 3.0 配置axios跨域访问豆瓣接口 自己做的小demo 由于豆瓣api跨域问题,因此不能直接通过ajax请求访问,我们通过vue-cli提供给我们的代理 进行配置即可, 在根目录下 ...

  2. 009-Spring Boot全局配置跨域请求支持

    1.Spring Boot 2.0以前全局配置跨域主要是继承WebMvcConfigurerAdapter @Configuration public class CorsConfig extends ...

  3. ASP.NET MVC4应用程序配置跨域访问

    开发框架是使用webapi做后台,HTML5做前台,通过ajax调用webapi后台,返回json结果. 用的编译器是visual Studio2013,下面是配置方法 1.web.config文件 ...

  4. django配置跨域并开发测试接口

    1.创建一个测试项目 1.1 创建项目和APP django-admin startproject BookManage # 创建项目 python manage.py startapp books ...

  5. 02.django配置跨域并开发测试接口

    1.创建一个测试项目   1.1 创建项目和APP   '''1.创建项目和APP''' django-admin startproject BookManage # 创建项目 python mana ...

  6. System.Web.Http.Cors配置跨域访问的两种方式

    System.Web.Http.Cors配置跨域访问的两种方式 使用System.Web.Http.Cors配置跨域访问,众多大神已经发布了很多文章,我就不在详细描述了,作为小白我只说一下自己的使用心 ...

  7. WebApi使用cors配置跨域问题

    1.首先安装CORS,在WebApiCors项目上面使用Nuget搜索“microsoft.aspnet.webapi.cors”,安装第一个 2.当我们安装这个包之后,现有的packages目录下会 ...

  8. nginx配置跨域、gzip加速、代理详细讲解

    1.配置跨域 这个很简单,直接打开配置nginx.conf ,在http下配置下面三行代码:当然如果你是想某一个虚拟主机下跨域,那就在哪个server下面添加 add_header Access-Co ...

  9. eclipse加速/Nginx配置跨域代理

    下班时间到啦! --下班都是他们的,而我,还是什么都没有. eclipse加速 去掉包含js文件的包的js验证,否则每次启动都需要进行校验(右击项目->properties) Nginx配置跨域 ...

随机推荐

  1. mysql 查询优化~join算法

    一简介:参考了几位师兄,尤其是M哥大神的博客,让我恍然大悟,赶紧记录下二 原理: mysql的三种算法 1 Simple Nested-Loop Join 将驱动表/外部表的结果集作为循环基础数据,然 ...

  2. Fragment中onCreateView()和onActivityCreated():静态/动态View

    在编写Fragment时,在onCreateView()方法中启动了一个初始化自定义View的方法 initView(),但是调试时就崩溃,打印日志发现是这里出了问题,就将这个方法放到了onActiv ...

  3. 【Python】批量查询-提取站长之家IP批量查询的结果加强版本v3.0

    1.工具说明 写报告的时候为了细致性,要把IP地址对应的地区给整理出来.500多条IP地址找出对应地区复制粘贴到报告里整了一个上午. 为了下次更好的完成这项重复性很高的工作,所以写了这个小的脚本. 某 ...

  4. Python中的元类

    从前面"Python对象"文章中了解到,在Python中一切都是对象,类可以创建实例对象,但是类本身也是对象. class C(object): pass c = C() prin ...

  5. Python基础-封装与扩展、静态方法和类方法

    一.封装与扩展 封装在于明确区分内外,使得类实现者可以修改封装内的东西而不影响外部调用者的代码:而外部使用者只知道一个接口(函数),只要接口(函数)名.参数不变,使用者的代码永远无需改变.这就提供一个 ...

  6. Kernel 3.0.8 内存管理函数【转】

    转自:http://blog.csdn.net/myarrow/article/details/7208777 1. 内存分配函数 相关代码如下: #define alloc_pages(gfp_ma ...

  7. Linux内核驱动基础(一)常用宏定义【转】

    转自:http://blog.csdn.net/tommy_wxie/article/details/9427081 一: __init和__initdata  : __exit和__exitdata ...

  8. Linux: 介绍make menuconfig中的每个选项含义【转】

    转自:http://blog.csdn.net/gaoyuanlinkconcept/article/details/8810468 介绍make menuconfig中的每个选项含义 Linux 2 ...

  9. jmeter之beanshell取出需要参数,传递给下个请求

    jmeter之beanshell取出需要参数,传递给下个请求 事件背景: 上周同事用jmeter录制脚本,录制成功回放后,并没有达到自己想要的结果. ps:他想从数据库取出某个字段值,然后对数据库做操 ...

  10. 第一个Spring Boot程序

    Windows 10家庭中文版,java version "1.8.0_152", Eclipse Oxygen.1a Release (4.7.1a),Spring Tools ...