NodeJS 我试图捆绑我的web应用程序与webpack在我的express js应用程序

xuo3flqw  于 2023-02-18  发布在  Node.js
关注(0)|答案(1)|浏览(111)

我试图建立我的express应用程序与webpack,我得到了很多错误我尝试了很多配置,但没有工作,我使用nodejs与express和ejs模板这是我第一次使用它来创建的东西,我需要建立它,这样我就可以部署它,但我不能与所有这些错误:

const express = require("express");
var minify = require("express-minify");
const MainRoute = require("./routes/index");
const driver = require("./routes/driver");
const session = require("express-session");
const MySQLStore = require("express-mysql-session")(session);
const mysql = require("mysql2");
const crypto = require("crypto");
const bcrypt = require("bcrypt");
const multer = require("multer");
const path = require("path");
const Chart = require('chart.js/auto');
const Canvas = require('canvas');
const ejs = require('ejs');
const fs = require('fs');

// define the include function
ejs.filters.include = function(file, data) {
  const filePath = path.join(__dirname, file);
  const fileContent = fs.readFileSync(filePath, 'utf8');
  return ejs.render(fileContent, data);
};

const app = express();

app.use(
  minify({
    cache: false,
    uglifyJsModule: null,
    errorHandler: null,
    jsMatch: /javascript/,
    cssMatch: /css/,
    jsonMatch: /json/,
    sassMatch: /scss/,
    lessMatch: /less/,
    stylusMatch: /stylus/,
    coffeeScriptMatch: /coffeescript/,
  })
);
app.use("/uploads", express.static(path.join(__dirname, "uploads")));

//------ Routes -------//
app.set("view engine", "ejs");
app.use(express.static("public"));
app.use("/", MainRoute);
app.use("/", driver);

// rest of the code

//---------- Server is on ---------//
app.listen(1000, () => {
  console.log("Server is On!!");
});

和我的webpack.config.js:

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
  mode: 'production',
  resolve: {
    fallback: {
      path: require.resolve("path-browserify"),
      fs: false,
      tls:false,
      net:"empty",
      "less": require.resolve("less"),
      "vm": require.resolve("vm-browserify"),
      "vm": false ,
      https: require.resolve('https-browserify'),
      crypto: require.resolve("crypto-browserify"),
      stream: require.resolve("stream-browserify"),
      zlib: require.resolve("browserify-zlib"),
      assert: require.resolve("assert/"),
      buffer: require.resolve("buffer/"),
      process: require.resolve("process/browser"),
      url: require.resolve("url/"),
      os: require.resolve("os-browserify/browser"),
      "timers": require.resolve("timers-browserify"),
      "http": require.resolve("stream-http"),
      "constants": require.resolve("constants-browserify"),
    },
  },
  entry: {
    server: './server.js'
  },
  output: {
    path: path.resolve(__dirname, 'public'),
    filename: '[name].js'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules)/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env', '@babel/preset-stage-2']
          }
        }
      },
      {
        test: /\.ejs$/,
        loader: 'ejs-loader',
        options: {
          esModule: false
        }
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: './views/index.ejs',
      hash: true,
    })
  ],
  node: {
    __dirname: false
  },
  target: 'node'
};

我是nodejs的新手,我希望你们能帮助我!我试着改变webpack的配置并安装所有的依赖项

ERROR in ./server.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: [BABEL] C:\Users\anasa\Desktop\ADROAD\server.js: 
As of v7.0.0-beta.55, we've removed Babel's Stage presets.
Please consider reading our blog post on this decision at
https://babeljs.io/blog/2018/07/27/removing-babels-stage-presets
for more details. TL;DR is that it's more beneficial in the
  long run to explicitly add which proposals to use.

For a more automatic migration, we have updated babel-upgrade,
https://github.com/babel/babel-upgrade to do this for you with
"npx babel-upgrade".

If you want the same configuration as before:

{
  "plugins": [
    // Stage 2
    ["@babel/plugin-proposal-decorators", { "legacy": true }],
    "@babel/plugin-proposal-function-sent",
    "@babel/plugin-proposal-export-namespace-from",
    "@babel/plugin-proposal-numeric-separator",
    "@babel/plugin-proposal-throw-expressions",

    // Stage 3
    "@babel/plugin-syntax-dynamic-import",
    "@babel/plugin-syntax-import-meta",
    ["@babel/plugin-proposal-class-properties", { "loose": false }],
    "@babel/plugin-proposal-json-strings"
  ]
}

If you're using the same configuration across many separate projects,
keep in mind that you can also create your own custom presets with
whichever plugins and presets you're looking to use.

module.exports = function() {
  return {
    plugins: [
      require("@babel/plugin-syntax-dynamic-import"),
      [require("@babel/plugin-proposal-decorators"), { "legacy": true }],
      [require("@babel/plugin-proposal-class-properties"), { "loose": false }],
    ],
    presets: [
      // ...
    ],
  };
};
 (While processing: "C:\\Users\\anasa\\Desktop\\ADROAD\\node_modules\\@babel\\preset-stage-2\\lib\\index.js")
  
ERROR in Template execution failed: ReferenceError: _ is not defined

ERROR in   ReferenceError: _ is not defined
  
  - index.ejs:10 module.exports
    C:/Users/anasa/Desktop/ADROAD/views/index.ejs:10:26
  
  - index.js:450 
    [ADROAD]/[html-webpack-plugin]/index.js:450:16
  
  - task_queues:95 process.processTicksAndRejections
    node:internal/process/task_queues:95:5
  
  - async Promise.all
  

webpack 5.75.0 compiled with 3 errors in 1650 ms
7eumitmz

7eumitmz1#

您可能正在使用已弃用的舞台预设。
试着用这个来修复它:
1 -安装正确的预设:npm install --save-dev @babel/preset-env
2 -如果你有像.babelrcbabel.config.js这样的babel配置文件,让它使用这个预置,或者更新你的webpack插件:

{
  "presets": [
    ["@babel/preset-env", {
      "targets": {
        "node": "current"
      }
    }]
  ]
}

3 -从你的巴别塔配置中移除阶段0和阶段1的预设。
希望能有所帮助!

相关问题