Babel.js 一次又一次地得到相同的错误语法错误:无效或意外的令牌

syqv5f0l  于 2024-01-04  发布在  Babel
关注(0)|答案(1)|浏览(181)

我一直试图运行我的index.mjs文件,但所有的时间得到同样的错误。这是我的index.mjs文件:

import WebSocket, { WebSocketServer } from "ws";
import http from "http";
import express from 'express';
import { fileURLToPath } from 'url';
import { dirname } from 'path';
import React from 'react';
import ReactDOM from 'react-dom';
import ChatButton from 'ChatButton';

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);

const app = express();
const server = http.createServer(app);

const wss = new WebSocketServer({ server });

// Keep track of connected clients
const clients = new Set();

wss.on('connection', (ws) => {
    console.log('Client connected');

    // Receive and store the username from the client
    ws.on('message', (message) => {
        const data = JSON.parse(message);

        if (data.type === 'username') {
            ws.username = data.username;
            // Notify all clients about the updated user list
            broadcastUserList();
        }
    });

    // Add the new client to the set
    clients.add(ws);

    // Notify all clients about the updated user list
    broadcastUserList();

    ws.on('message', (message) => {
        // Parse the message
        const data = JSON.parse(message);

        // Check message type
        switch (data.type) {
            case 'chat':
                // Broadcast the chat message to all clients
                broadcastMessage({ type: 'chat', message: data.message });
                break;
            case 'typing':
                // Broadcast typing status to all clients
                broadcastMessage({ type: 'typing', username: data.username, isTyping: data.isTyping });
                break;
            default:
                break;
        }
    });

    ws.on('close', () => {
        console.log('Client disconnected');

        // Remove the client from the set
        clients.delete(ws);

        // Notify all clients about the updated user list
        broadcastUserList();
    });
});

function broadcastMessage(message) {
    // Broadcast the message to all clients
    wss.clients.forEach((client) => {
        if (client.readyState === WebSocket.OPEN) {
            client.send(JSON.stringify(message));
        }
    });
}

function broadcastUserList() {
    // Create an array of usernames
    const userList = Array.from(clients).map((client) => {
        return { username: client.username, online: client.readyState === WebSocket.OPEN };
    });

    // Broadcast the updated user list to all clients
    broadcastMessage({ type: 'userList', userList });
}

// Define the App component
const App = () => {
    return (
        <div>
            {/* Your existing website content */}
            <h1>Welcome to Your Website</h1>

            {/* Include the ChatButton component */}
            <ChatButton />

            {/* Other components or content */}
        </div>
    );
};

// Render the App component
ReactDOM.createRoot(document.getElementById('root')).render(<App />);

// Serve the HTML file
app.get('/', (req, res) => {
    res.sendFile(__dirname + '/index.html');
});

// Start the server
server.listen(3000, () => {
    console.log('Server listening on http://localhost:3001');
});

字符串
它会引发此块的错误:

const App = () => {
    return (
        <div>
            {/* Your existing website content */}
            <h1>Welcome to Your Website</h1>

            {/* Include the ChatButton component */}
            <ChatButton />

            {/* Other components or content */}
        </div>
    );
};


使用chat gpt,我尝试使用babel或esm。我还尝试将mjs更改为jsx,包括在packages.json中进行所有必要的更改,但始终引发相同的错误。这里是错误本身:
[file:/C:/Users/leoni/WebstormProjects/chatbuttontest/index.mjs:93 ^
语法错误:无效或意外的令牌]
Node.js v21.2.0
提前感谢!

sbtkgmzw

sbtkgmzw1#

如果您在ChatButton组件中使用了export default,请使用import ChatButton from './ChatButton',否则请使用import {ChatButton} from './ChatButton'而不是import ChatButton from 'ChatButton';

相关问题