1.生成项目
命令行执行：create-react-app myapp，生成如下结构：
2.安装sass依赖，让你在项目中可以使用scss模块化，index.module.scss：
npm i node-sass sass-loader -D
之后就能用了，rules配置脚手架已经处理了,使用：
/*index.module.scss*/ .test{ background-color: pink; min-height: 100vh; }
// index.jsx中
import React from ‘react‘; import styles from ‘./index.module.scss‘ function App() { return ( <div className={styles.test}> </div> ); } export default App;
3.异步加载组件
npm install --save react-loadable
// 1.引入 import loadable from ‘react-loadable‘; import Loading from ‘@/components/Loading‘; // import Index from ‘@/pages/Index‘; // import IndexSort from ‘@/pages/IndexSort‘;
// 2.改造引入组件的方式 const Index = loadable({ loader:()=>import(‘@/pages/Index‘), loading:Loading,//Loading为加载中展示的组件 }); const IndexSort = loadable({ loader:()=>import(‘@/pages/IndexSort‘), loading:Loading, }); // 3.直接使用改造之后的组件 { path: ‘/‘, exact:true, component: Index, }, { path: ‘/index-sort‘, component: IndexSort, },
更新中