react移动端适配方案
本文项目基于create-react-app构建。更多移动端资料推荐
1 | /* 处理 vm 适配图片不显示问题 */ |
1️⃣ 项目初始 + 暴露配置项
- 1、create-react-app react-vw-layout 初始化项目
- 2、npm run eject 暴露配置项
2️⃣ postCss插件安装配置
package.json 中添加依赖,并安装
1 |
|
config/webpack.config.dev.js 文件中修改添加配置(开发环境生效)
(生产环境打包配置如下,也是一样的在文件夹 config/webpack.config.prod 中修改)
1 | // config/webpack.config.dev.js |
3️⃣测试验证
修改 App.css 文件
1 | .App { |
npm start 启动项目,打开控制台,这个时候已经生效了
配置好生产环境之后验证,npm run build,这个时候,生产打包已经生效了。
4️⃣ 一些兼兼容性hacks处理
修改 public/index.html, 引入阿里的 cdn
1 | <!-- index.html body 后添加--> |
至此配置算是完成了,更多其中插件的配置,还需要了解一下官方的配置使用,此外插件和可行性方案都会更新,这里只是作为自己学习实际的一个可行性方案实践的过程,如果有更多更新方案可以留言告知。谢阅~