react设置基础路由、修改打包路径

设置基础路由

1.基础路由设置使用了 basename

import React from 'react'
import {
  BrowserRouter as Router,
  Route,
  Switch,
  Redirect
} from 'react-router-dom'
import * as Login from '@pages/login'
  <Router basename = "/test">
    <Switch>
      <Redirect exact path = "/" to = "/login" />
      <Route exact path = "/login" component = {Login.normalLogin}></Route>
    </Switch>
  </Router>
)

2.然后我们访问页面会发现每个路由前面都添加了基础路由/test

修改打包路径

在config->paths.js中

// config after eject: we're in ./config/
module.exports = {
  dotenv: resolveApp('.env'),
  appPath: resolveApp('.'),
  appBuild: resolveApp('dist/ar'), //这行就是打包路径，默认为build，即执行cnpm run build后，会创建一个名为build文件夹并将内容放置于此文件夹内
  appPublic: resolveApp('public'),
  appHtml: resolveApp('public/index.html'),
  appIndexJs: resolveModule(resolveApp, 'src/index'),
  appPackageJson: resolveApp('package.json'),
  appSrc: resolveApp('src'),
  appTsConfig: resolveApp('tsconfig.json'),
  appJsConfig: resolveApp('jsconfig.json'),
  yarnLockFile: resolveApp('yarn.lock'),
  testsSetup: resolveModule(resolveApp, 'src/setupTests'),
  proxySetup: resolveApp('src/setupProxy.js'),
  appNodeModules: resolveApp('node_modules'),
  publicUrlOrPath,
};

注意：以上这些配置操作都是以运行cnpm run eject后暴露配置文件为前提
最后记得给个赞！