我建立的WebPack我的阵营项目之间糊涂了babel,babel-core,babel-loader,babel-preset-2015和babel-preset-react.我知道Babel需要将ES7或ES6代码转换为ES5,但在我的package.json安装中我已经安装了所有这些依赖项,除了Babel,它们也是如此devDependencies.

有人可以解释一下这些之间的差异以及为什么我的项目需要所有这些之间的区别？是不是有任何单一的依赖来替换它们？如果他们如此重要,为什么他们被包括在内 devDependencies？

当我想启动 vue 3 typescript 项目时出现以下错误：

 ERROR  Error [ERR_UNSUPPORTED_ESM_URL_SCHEME]: Only file and data URLs are supported by the default ESM loader. On Windows, absolute paths must be valid file:// URLs. Received protocol 'c:'\n Error [ERR_UNSUPPORTED_ESM_URL_SCHEME]: Only file and data URLs are supported by the default ESM loader. On Windows, absolute paths must be valid file:// URLs. Received protocol 'c:'\nat new NodeError (node:internal/errors:371:5)\nat defaultResolve (node:internal/modules/esm/resolve:1016:11)\nat ESMLoader.resolve (node:internal/modules/esm/loader:422:30)\nat ESMLoader.getModuleJob (node:internal/modules/esm/loader:222:40)\nat ESMLoader.import (node:internal/modules/esm/loader:276:22)\nat importModuleDynamically (node:internal/modules/cjs/loader:1041:29)\nat importModuleDynamicallyWrapper (node:internal/vm/module:437:21)\nat importModuleDynamically (node:vm:381:46)\nat importModuleDynamicallyCallback (node:internal/process/esm_loader:35:14)\nat loadFileConfig (C:\\Projects\\backify-ui\\documentation\\node_modules\\@vue\\cli-service\\lib\\util\\loadFileConfig.js:28:7)\n …

babel-core 和@ babel/core有什么区别 ？

它们是相同的东西,但不同的版本？如果不是这样,你何时使用另一个,何时使用另一个？

谢谢.

我第一次使用 React，所以如果我做了一些明显且令人难以置信的错误，我深表歉意。也就是说，我已经在此处和 github 上阅读了几个看似类似的错误，但我找不到任何适合我的内容。这是完整的错误消息：

ERROR in ./src/frontend/src/components/App.js 6:15
Module parse failed: Unexpected token (6:15)
You may need an appropriate loader to handle this file type.
| class App extends Component{
|     render() {
>         return <h1>React App</h1>
|     }
| }
 @ ./src/frontend/src/index.js 1:0-35

得出该错误消息的完整代码：

import React, { Component } from 'react';
import ReactDOM from 'react-dom';

class App extends Component{
    render() {
        return <h1>React App</h1>
    }
}

ReactDOM.render(<App />, document.getElementById('app'));

我觉得我的 webpack-config.js 有问题，但我直接从我正在使用的教程中复制了它，所以我不确定为什么会出错。这是，供参考：

module.exports = {
  module: {
    rules: [ …

我有一个反应项目。在我导入 React 的每个 .js 文件的第一行中，我收到此错误：Parsing error: Cannot find module '@babel/preset-react'。

包.json

{
    "name": "admin",
    "version": "2.0.0",
    "description": "",
    "author": "",
    "main": "index.js",
    "engines": {
        "node": ">=14.15 <15",
        "npm": "~6"
    },
    "scripts": {
        "build-config:local": "CONFIG_ENV=local npm run build-config",
        "build-config:dev": "CONFIG_ENV=dev npm run build-config",
        "build-config:staging": "CONFIG_ENV=staging npm run build-config",
        "build-config:prod": "CONFIG_ENV=prod npm run build-config",
        "build-config": "buildconfig --env $CONFIG_ENV",
        "build": "npm run build-config && webpack --config ./webpack.config.js --mode production",
        "start": "webpack-dev-server --config ./webpack.config.dev.js --mode development"
    },
    "dependencies": {
        "@babel/eslint-parser": "^7.15.7",
        "@fortawesome/fontawesome-svg-core": …

我在构建项目时遇到错误:

Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: Cannot read property 'bindings' of null

我的开发环境如下:

节点:8.0.0
npm:5.0.0

devDependencies

"devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^8.0.0",
    "babel-preset-env": "^1.7.0",
    "webpack": "^4.17.1",
    "webpack-dev-server": "^3.1.7"
}

I upgraded babel 6.x ? 7.x but having issues running Webpack.

It is complaining about missing core-js/modules/*.

My babel.config.js is in the root directory. I converted the previously existing .babelrc to js (.babelrc also produced the same errors). I am guessing it is some collision with all the core, corejs2, runtime stuff.

There are two apps in my src, mine and Styleguidist (in ./node_modules). My app transpiles and works with these same package.json/babel.config, but …

我有2个Vue-Cli webpack项目(ClientApp和Lib).Lib是我的组件库(与其他项目共享)

问题

当我构建我的项目ClientApp时npm run build,我有以下错误:

ERROR in static/js/app.d08a24ce0e8d0438ce68.js from UglifyJs
Unexpected token: operator (>) [C:/.../Lib/src/tools/escape-key.js:3,0][static/js/app.d08a24ce0e8d0438ce68.js:17468,38]

问题

似乎错误来自文件中的箭头功能escape-key.js.这是ES6语法而UglifyJS无法解析此问题.在Uglify之前,Babel不应该先行吗？请注意,它适用于*.vue文件.

项目结构

ClientApp
   | - build
   | - config
   | - src
       | - App.Vue // import EscapeKey from '~lib/tools/escape-key';



Lib
  | -src
     | - tools
         | - escape-key.js

ClientApp的webpack.base.conf.js文件

注意Lib有一个别名.

resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      '@': resolve('src'),
      '~lib': path.join(__dirname, '../../lib/src'),
    }
  },

如有需要,请随时询问更多详情.

我在我的 Vue 项目中使用 Nuxt，它运行良好。由于其他项目问题，我删除了我的纱线和 NPM 缓存。我为我的 Nuxt 应用程序重新安装了软件包。该应用程序是通用的，并使用快递。安装和开发服务器正在运行，但是当我尝试访问时http://localhost:3000/，

错误：

SyntaxError：意外的令牌导出，每次都出现。

我知道这是 babel 问题，但我不知道如何在 Nuxt 上解决这个问题。

Nuxt配置：

const pkg = require('./package')

module.exports = {
  mode: 'universal',

  /*
  ** Headers of the page
  */
  head: {
    title: pkg.name,
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: pkg.description }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },

  /*
  ** Customize the progress-bar color
  */
  loading: …

问题

create-react-app 将安装了babel-loader的存储库初始化为旧版本而不是需要的版本.

日志:

There might be a problem with the project dependency tree.
It is likely not a bug in Create React App,
but something you need to fix locally.

The react-scripts package provided by Create React App requires a dependency:

  "babel-loader": "8.0.4"

Don't try to install it manually: your package manager does it automatically.
However, a different version of babel-loader was detected higher up in the tree:

  C:\Users\user\node_modules\babel-loader (version: 8.0.2)

Manually installing incompatible versions is known to cause …