javascript - 为什么 babel-watch 可以编译和运行我的代码而 babel 不能？

Question

我遇到了一个奇怪的情况，我希望有人能帮助我并解释为什么会发生这种情况。

处理我使用 babel-watch 的代码，一切都很好，直到我需要将代码编译到“dist”文件夹中以便能够在 Heroku 上运行它。

我无法运行代码，但它已成功编译，并且无论如何我都会遇到不同的错误，例如：

uncaughtException: Unexpected token :\nC:\\Users\\Валерий\\Documents\\Projects\\cocoon-api\\dist\\environment\\development.js.map:1\n{\"version\":3,\"sources\":[\"../../src/environment/development.js\"],\"names\":[\"dotenv\",\"config\",\"development\",\"port\",\"process\",\"env\",\"PORT\",\"db\",\"username\",\"DB_USER\",\"password\",\"DB_PASSWORD\",\"name\",\"DB_NAME\",\"token_secret\",\"TOKEN_SECRET\",\"hash_rounds\",\"HASH_ROUNDS\",\"log_level\",\"mail\",\"host\",\"MAIL_HOST\",\"MAIL_PORT\",\"secure\",\"MAIL_SECURE\",\"user\",\"MAIL_USER\",\"pass\",\"MAIL_PASS\",\"dev\",\"sub\",\"general\",\"key\"],\"mappings\":

如果它不适用于 babel-watch，我会认为这是代码的问题，但由于它确实在开发模式下工作，我认为这是编译器的问题 - Babel。

如果有人知道如何正确设置它以使其正常工作，我将非常感激！

项目.json

{
  "name": "cocoon-api",
  "version": "1.0.0",
  "description": "",
  "private": true,
  "main": "src/server.js",
  "scripts": {
    "clean": "rm -rf dist",
    "build": "babel ./src --out-dir ./dist --source-maps",
    "prod": "node ./dist/server.js",
    "start": "set NODE_ENV=production&&npm-run-all clean build prod",
    "old:start": "set NODE_ENV=production&&babel-watch src/server.js",
    "old:dev": "babel-watch src/server.js",
    "compile": "rm -rf dist && babel src --out-dir dist"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@babel/polyfill": "^7.8.7",
    "apollo-server-express": "^2.9.14",
    "bcryptjs": "^2.4.3",
    "body-parser": "^1.19.0",
    "cors": "^2.8.5",
    "express": "^4.17.1",
    "graphql": "^14.5.8",
    "graphql-depth-limit": "^1.1.0",
    "graphql-iso-date": "^3.6.1",
    "graphql-middleware": "^4.0.2",
    "graphql-shield": "^7.0.6",
    "graphql-tag": "^2.10.1",
    "graphql-toolkit": "^0.7.5",
    "graphql-tools": "^4.0.6",
    "jsonwebtoken": "^8.5.1",
    "lodash": "^4.17.15",
    "merge-graphql-schemas": "^1.7.4",
    "mongoose": "^5.8.3",
    "nodemailer": "^6.4.4",
    "npm-run-all": "^4.1.5",
    "password-validator": "^5.0.3",
    "simple-crypto-js": "^2.2.0",
    "validator": "^12.2.0",
    "winston": "^3.2.1"
  },
  "devDependencies": {
    "@babel/cli": "^7.8.4",
    "@babel/core": "^7.8.7",
    "@babel/node": "^7.7.7",
    "@babel/preset-env": "^7.8.7",
    "babel-plugin-import-graphql": "^2.7.0",
    "babel-watch": "^7.0.0",
    "dotenv": "^8.2.0",
    "nodemon": "^2.0.2"
  }
}

错误中提到的文件

// require('dotenv').config();

import dotenv from 'dotenv';
dotenv.config();

export const development = {
  port: process.env.PORT || 3000,
  db: {
    username: process.env.DB_USER,
    password: process.env.DB_PASSWORD,
    name: process.env.DB_NAME,
  },
  token_secret: process.env.TOKEN_SECRET,
  hash_rounds: process.env.HASH_ROUNDS,
  log_level: 'info',
  mail: {
    host: process.env.MAIL_HOST,
    port: process.env.MAIL_PORT,
    secure: process.env.MAIL_SECURE,
    user: process.env.MAIL_USER,
    pass: process.env.MAIL_PASS
  },
  development: 'test',
  dev: { sub: 'test' },
  general: { key: 'value' }
};

// console.log(development);

// module.exports = development;

通天塔配置

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

入口点

import { env } from "./environment";
import { apiExplorer } from "./graphql";
import express from "express";
import { ApolloServer } from "apollo-server-express";
import { database } from "./utils/database";
import { logger } from "./utils/logging";
import { verify } from "./utils/jwt";
import confirmRoute from './routes/confirm';
import test from './routes/test';

database.init();

apiExplorer.getSchema().then((schema) => {

  // Configure express
  const port = env.PORT;
  const app = express();

  app.use('/confirm', confirmRoute);
  app.use('/', test);

  // Configure apollo
  const apolloServer = new ApolloServer({
    schema,
    context: ({ req, res }) => {
      const context = [];

      // verify jwt token
      context.authUser = verify(req, res);

      return context;
    },

    formatError: (error) => {
      logger.error(error);
      return error;
    },

    debug: true

  });
  apolloServer.applyMiddleware({ app });

  app.listen({ port }, () => {
    logger.info(`Server ready at http://localhost:${port}${apolloServer.graphqlPath}`);
  });

})
  .catch((err) => {
    logger.error('Failed to load api at : ', err);
  })

标签： javascriptecmascript-6babeljsbabel-polyfill