账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    react+webpack-dev-server开发模式动态指定Restful的url
    21
    0

    使用webpack-dev-server 做react 的开发模式

    node.js + react 自建本地开发服务器localhost:9000

    但组件中用Fetch发送请求给后端拿数据,测试时URL写死为localhost:9100/get/test
    (ps:localhost:9100为后端请求地址)

    而到了与后端代码整合的时候URL只写成/get/test就好了

    请问:webpack-dev-server测试时如何也能在URL只写/get/test,请求时自动加上localhost:9100前缀?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 旋转木马的等待 普通会员 1楼

      在React中,你可以使用webpack-dev-server和react-router-dom库来开发动态指定Restful的URL的网站。以下是一个简单的示例:

      首先,你需要在你的项目中安装react-router-dom和webpack-dev-server。你可以使用npm或yarn来安装:

      bash npm install react-router-dom webpack-dev-server

      然后,你可以创建一个React组件来显示Restful的URL。例如,你可以创建一个名为ShowURL的组件:

      ```jsx import React from 'react';

      const ShowURL = () => { return (

      Display URL

      Home About Contact
      ); };

      export default ShowURL; ```

      然后,你可以使用webpack-dev-server来开发你的React应用。首先,你需要在你的项目中安装webpack-dev-server:

      bash npm install webpack-dev-server

      然后,你可以创建一个名为webpack.config.js的文件来配置webpack。在该文件中,你可以添加以下代码:

      ```javascript const path = require('path');

      module.exports = { // 输出文件路径 output: { path: path.resolve(__dirname, 'dist'), filename: '[name].js', }, // 热加载配置 devServer: { hot: true, port: 3000, }, }; ```

      在上述代码中,output对象设置了输出文件的路径和名称,devServer对象设置了热加载的配置。

      最后,你可以运行webpack-dev-server来启动你的应用:

      bash webpack-dev-server --host 0.0.0.0 --port 3000

      现在,当你访问你的网站时,它会显示你的React应用的入口点,即你的RESTful的URL。

    更多回答
    网站公告
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部