配置路径
当页面嵌套过深时我们会发现在路径通常都要这么写 import xx from './../../../xxx/qqq'
通过配置webpack可以写成 import xx from '@/xxx/qqq'
// 修改 webpack.config.dev 与 webpack.config.prod 两个文件 加入相同配置 ... // +++ 找个开心的地方加入配置 function resolve(dir) { return path.join(__dirname,'..',dir) } // 修改 alias: { 'react-native': 'react-native-web',// +++ 加入配置 '@': resolve('src') }
优点: 如果按照相对路径的方法引用,每次要计算.. 并且文件一旦迁移 那么又要重新计算,如此配置文件迁移也不需要计算
缺点: 在部分编辑器可能会失去文件引用高亮,但并不影响.
注 :这属于webpack的配置,当然在vue-cli中也适用
按需引用atnd-mobile
先安装 babel-plugin-import
npm i babel-plugin-import -D
// pageage.json 文件 "babel": { "presets": [ "react-app" ],// 加入配置 "plugins": [ ["import",{ "libraryName": "antd-mobile","style": "css" }] ] },
设置代理
在开发中往往是跨域请求的,配置一下请求代理可以解决这个问题
// pageage.json 文件 "proxy": "http://xxx.xxx",
css局部化
正常导入css情况下会污染到全局
修改 webpack-config-dev.js 配置 (如没有该文件请使用
npm run eject
弹出)
options: { modules: true,localIdentName: '__[local]--[hash:base64:5]' }
支持装饰器写法
安装 transform-decorators-legacy
npm install --save-dev babel-plugin-transform-decorators-legacy
// pageage.json 文件 在刚刚配置 ant 下面加上 "babel": { "presets": [ "react-app" ],"plugins": [ ...ant配置,// 加入配置 "transform-decorators-legacy" ] }
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。