Question

我有一个webpack，express和mongodb

的小项目。

我的项目结构：

 - my_proyect
   - src/ 
     - repo.js
   - server.js
   - webpack.config.js
   - package.json
   - node_modules/

server.js

const express = require('express');
const webpack = require('webpack');
const webpackDevMiddleware = require('webpack-dev-middleware');

const app = express();
const config = require('./webpack.config.js');
const compiler = webpack(config);

// Tell express to use the webpack-dev-middleware and use the webpack.config.js
// configuration file as a base.
app.use(webpackDevMiddleware(compiler, {
  publicPath: config.output.publicPath
}));

// Serve the files on port 3000.
app.listen(3000, function () {
  console.log('Example app listening on port 3000!\n');
});

webpack.config.js

const path = require('path');
const HtmlWebPackPlugin = require('html-webpack-plugin');
const CleanWebPackPlugin = require('clean-webpack-plugin');

module.exports = {
  mode: 'development',
  entry: {
    print: './src/print.js'
  },
  devtool: 'inline-source-map',
  devServer: {
    contentBase: './dist'
  },
  plugins: [
    new CleanWebPackPlugin(['dist']),
    new HtmlWebPackPlugin({
      title: 'Node project',
      filename: 'index.html',
      favicon: './src/images/favicon.png'
    })
  ],
  output: {
    filename: '[name].bundle.js',
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/'
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader'] 
      },
      {
        test: /\.(png|svg|jpg|gif)$/,
        use: ['file-loader']
      }  
    ]
  }
};

index.js

import './style.css'
import repo from './repo.js';

function component() {
  let btn = document.createElement('button');
  element.classList.add('hello');
  btn.innerHTML = 'Click me';
  btn.onclick = repo.connect(err => {
    // actions to db
  });
  element.appendChild(btn);
  return element;
}

document.body.appendChild(component());

repo.js

const MongoClient = require('mongodb').MongoClient;
const uri = "url_connection";
const client = new MongoClient(uri, { useNewUrlParser: true });

export default client;

package.json

{
  "name": "my_project",
  "version": "1.0.0",
  "description": "",
  "private": true,
  "dependencies": {
    "@types/mongodb": "^3.1.17",
    "bson-ext": "^2.0.1",
    "kerberos": "^1.1.2",
    "lodash": "^4.17.11",
    "mongodb": "^3.1.10",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "semantic-ui-css": "^2.4.1",
    "semantic-ui-react": "^0.84.0"
  },
  "devDependencies": {
    "clean-webpack-plugin": "^1.0.0",
    "css-loader": "^2.0.1",
    "express": "^4.16.4",
    "file-loader": "^2.0.0",
    "html-webpack-plugin": "^3.2.0",
    "style-loader": "^0.23.1",
    "webpack": "^4.28.0",
    "webpack-cli": "^3.1.2",
    "webpack-dev-middleware": "^3.4.0",
    "webpack-dev-server": "^3.1.10"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "watch": "webpack --watch --watch-poll --config=webpack.config.js",
    "build": "webpack",
    "start": "webpack-dev-server --open",
    "server": "node server.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

当我运行npm run server时，它将返回有关mongodb软件包的此错误，知道为什么会发生吗？也许项目结构不好，但是缺少某些东西。

./ node_modules / mongodb-core / lib / uri_parser.js模块中没有错误找到：错误：无法解析“ dns” '/ my_project / webpack / node_modules / mongodb-core / lib' @ ./node_modules/mongodb-core/lib/uri_parser.js 4：12-26 @ ./node_modules/mongodb-core/index.js @ ./node_modules/mongodb/index.js @ ./src/repo.js @ ./src/index.js

./node_modules/mongodb-core/lib/uri_parser.js中的错误-找不到模块：错误：无法解析其中的“ dns”

0 个答案: