babel-loader babel-core

2024-06-22 09:53:17

一、问题描述

在配置webpack.config.js自动打包的时候,出现Error: Cannot find module '@babel/core'错误
最初以为是babel-core没有安装上。重装了好几遍babel-core还是不行。对照以前的项目,发现babel-loader的版本不一样,之前的是@7.1.5版本,而现在是@8.0.0版本。

二、解决方法

带着半信半疑的心情安装回@7.1.5版本

npm uninstall babel-loader
npm install babel-loader@7.1.5

再npm run build发现成功了！
有点纳闷,距离上次安装不过才几天,就更新成babel-loader@8.0.0。而且还不支持原来的配置了。网上没有找到方法解决,原理也还不清楚。先mark一下,以后解决了@8.0.0的这个问题再回来补充。

附上webpack.config.js代码:

var webpack = require('webpack');
var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');module.exports = {entry: __dirname + '/client/root/index', //入口文件output: {path: path.join(__dirname + '/dist'),filename: 'bundle.js',  //打包后文件名},module: {loaders : [{test :/(\.jsx|\.js)$/,exclude : /node_modules/,loader :'babel-loader',options:{presets:["env", "react", ]}},{test: /\.css$/,loader: 'style-loader!css-loader'},{test: /\.less$/,loader: 'style-loader!css-loader!less-loader'},{test: /\.(jpg|.png)$/,loader: 'url-loader'}]},plugins: [//打包引用模板new HtmlWebpackPlugin({template: __dirname + '/client/views/template.html'}),]
}

关于babel-loader@8.0.0出现错误原因已经找到,感谢@Sky__zt的回答.
(忘了去看官方文档了)

官方默认babel-loader | babel 对应的版本需要一致: 即babel-loader需要搭配最新版本babel

具体请参考:《npm_babel-loader》

总结:

两种解决方案: 1. 回退低版本

npm install -D babel-loader@7 babel-core babel-preset-env

更新到最高版本:

npm install -D babel-loader @babel/core @babel/preset-env webpack

babel-loader babel-core相关推荐

Babel 之 @babel/preset-env
Babel 已经成为前端工程化开发的必备工具链.自 Babel 7.0 以后,Babel 进一步对工具优化和插件统一管理,全面迁移到 @babel 中.@babel/preset-env 是十分常用的 ...
webpack + loader 使用笔记
先睹为快 demo 地址点这里 1. 准备一个 webpack_demo 创建 src 和 dist 文件夹在 src 目录下创建 js 文件夹在 js 文件夹下创建 module-1.js,m ...
【笔记整理】vue.js笔记
### 准备开始 1:主要学习的是VUE,快速进入VUE让大家体会VUE的使用 2:webpack前端构建构建,前期铺垫基本使用,后面看到不晕 3:在做完项目以后,模 ...
Webpack是做什么的
Webpack的作用当前web开发面临的困境文件依赖关系错综复杂静态资源请求效率低模块化支持不友好浏览器对高级JavaScript特性兼容度较低 Webpack 是一个前端资源的打包工具,它 ...
一个合格的初级前端工程师需要掌握的模块笔记
一个合格的初级前端工程师需要掌握的模块笔记文章目录一个合格的初级前端工程师需要掌握的模块笔记前言 Web模块 html基本结构标签属性事件属性文本标签多媒体标签列表表格表单标签其 ...
webpack5.x 各种开发常见配置大汇总 loader plugin devServer proxy babel 懒加载
webpack学习之旅文章目录 webpack学习之旅 webpack基础打包认识webpack 脚手架依赖webpack webpack是什么 Vue项目加载的文件有哪些 webpack使用前提 ...
react 引入 mobx @babel/core: 7.2.2
为什么80%的码农都做不了架构师?>>> yarn add @babel/plugin-proposal-class-propertiesyarn add @babel/plu ...
webpack4.0 babel配置遇到的问题
babel配置 babel版本升级到8.x之后发现出现了很多问题. 首先需要安装 "@babel/core": "^7.1.2", "@babel/p ...
babel原理_带你了解 snowpack 原理，你还学得动么（下）
作者:AlienZHOU 转发链接:https://zhuanlan.zhihu.com/p/149351900 目录带你了解 snowpack 原理,你还学得动么(上) 带你了解 snowpack ...
JavaScript高级语法打包 - babel插件安装配置报错！Error: Cannot find module ‘@babel/preset-preset.env‘
目录 1. 插件安装和配置 2. 运行打包 - 报错信息 3. 解决办法 1. 插件安装和配置安装babel转换器相关的包: npm i babel-loader @babel/core @babe ...

最新文章

热门文章