I want to integration mocker-api in my create-react-app . as the mocker-api docume

Try doing something along the following lines: <div class="highlight highlight-sou

Did you follow <a href="https://webpack.js.org/configuration/dev-server/" rel="nofollo

i found the answer in res <a href="https://github.com/harrysolovay/res#res

how to config webpack devServer' before(app) about rescripts HOT 6 CLOSED

ylyxf commented on July 28, 2024

how to config webpack devServer' before(app)

from rescripts.

Comments (6)

harrysolovay commented on July 28, 2024

Try doing something along the following lines:

const { appendWebpackPlugin } = require('@rescripts/utilities')
const webpack = require('webpack');

module.exports = [
  {
    devServer: () => ({
      before(app) {
        apiMocker(app, path.resolve('./mocker/index.js'),
        {
          proxy: {
            '/repos/*': 'https://api.github.com/',
            '/:owner/:repo/raw/:ref/*': 'http://127.0.0.1:2018'
          },
          changeHost: true,
        }),
      },
    },
  },
  ['use-babel-config', '.babelrc'],
  appendWebpackPlugin(
    new webpack.DefinePlugin({
      'process.env': {
        LOCALE: JSON.stringify('zh-CN'),
      },
    }),
  )
];

Let me know how this goes 👍

from rescripts.

ylyxf commented on July 28, 2024

Thank you ! I works!
But still have a little problem:
when i add just an empty devServer ,the cra project can run , but has an exception on startup :

module.exports = [
    {
        devServer: () => ({
            
        })
    },
    ['use-babel-config', '.babelrc']
    , appendWebpackPlugin(
        new webpack.DefinePlugin({
            'process.env': {
                LOCALE: JSON.stringify('zh-CN'),
            },
        }),
    )
];

× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)
× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)
× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)
× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)
× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)
× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)
× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)
× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)
× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)
× ｢wds｣: Exception on "GET /sockjs-node" in filter "welcome_screen":
Error [ERR_STREAM_WRITE_AFTER_END]: write after end
    at writeAfterEnd (_stream_writable.js:257:14)
    at Socket.Writable.write (_stream_writable.js:306:5)
    at Socket.Writable.end (_stream_writable.js:617:10)
    at Socket.end (net.js:580:31)
    at App.exports.GenericApp.GenericApp.handle_error (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:152:15)
    at execute_request (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:36:28)
    at IncomingMessage.req.next_filter (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:105:18)
    at Listener.webjs_handler (D:\Projects\shinein\node_modules\sockjs\lib\webjs.js:107:13)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:150:12)
    at Listener.handler (D:\Projects\shinein\node_modules\sockjs\lib\sockjs.js:6:59)

from rescripts.

harrysolovay commented on July 28, 2024

You're overriding the preexisting dev server config with an empty object. That's not a valid CRA dev server config. Hence the error.

from rescripts.

ylyxf commented on July 28, 2024

when the config like this , the error is still exist

{
        devServer: () => ({
            before(app) {
                apiMocker(app, path.resolve('./mock/index.js'), {})
            }
        })
    }

this code may also overrid the preexisting dev server config.

is there any method to get the CRA dev server config ，so i can customize it, merge my
apiMocker ?

from rescripts.

harrysolovay commented on July 28, 2024

Did you follow the WebPack Dev Server documentation?

from rescripts.

ylyxf commented on July 28, 2024

i found the answer in rescripts readme .
CodeA:

devServer: () => ({
            before(app) {
                apiMocker(app, path.resolve('./mock/index.js'), {})
            }
        })

CodeB:

devServer: config => {
             newConfig = doConfig(config);
             return config ;
        }

CodeA means override all devServer config, CodeB means change devServer config.

I should use CodeB .

this is my config ,and it works:

     const { appendWebpackPlugin } = require('@rescripts/utilities')
const webpack = require('webpack');
const path = require('path');
const apiMocker = require('mocker-api');

module.exports = [
    {
        devServer: config => {
            defaultBefore = config.before;
            config.before = (app, server) => {
                defaultBefore(app, server);
                apiMocker(app, path.resolve('./mock/index.js'), {})
            }
            return config
        }
    },
    ['use-babel-config', '.babelrc']
    , appendWebpackPlugin(
        new webpack.DefinePlugin({
            'process.env': {
                LOCALE: JSON.stringify('zh-CN'),
            },
        }),
    )
];

thank you ! @harrysolovay

from rescripts.

how to config webpack devServer' before(app) about rescripts HOT 6 CLOSED

Comments (6)

Related Issues (20)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent