Vue2.X部分常用配置

2018-11-19  本文已影响0人  静静前行

1.全局配置css预编译语言,如stylus

前提需先安装stylus,

1.1 npm i stylus-loader

1.2 npm i stylus

1.3在build/utils.js中更改添加如下(theme.styl为stylus文件,路径请根据实际更改)

2.配置px2rem

2.1 npm i px2rem-loader

2.2 在build/utils.js中更改添加

const px2remLoader = {

loader:'px2rem-loader',

options: {

remUnit:16

  }

}

找到generateLoaders函数更改

const loaders = options.usePostCSS ? [cssLoader,postcssLoader] : [cssLoader]为

const loaders = options.usePostCSS ? [cssLoader,postcssLoader,px2remLoader] : [cssLoader,px2remLoader]

2.3在index.html中引入适配js

<script>

<!--引入px2rem-loader后自动将px转化rem-->

(function (win,doc) {

function setSize() {

doc.documentElement.style.fontSize =16*document.documentElement.clientWidth/375+'px'

    }

setSize()

win.addEventListener('resize',setSize,false)

})(window,document)

</script>

2.2 2.3

3.vue跨域配置

3.1在config/index.js中更改

3.1

3.2在config/dev.env.js中更改

3.2

3.3在config/prod.env.js中更改

3.3

3.4在main.js中添加Vue.prototype.baseURL =process.env.API_HOST

3.5请求数据时(如上一步API_HOST配置为http://baidu.com,请求数据的接口为http://baidu.com/h.php,则以下可写为`${this.baseURL}/h.php`,注意这里的``不是单引号,是tab键上面那个)

上一篇 下一篇

猜你喜欢

热点阅读