Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ERROR in multi babel-polyfill ./src/client/index Module not found: Error: Can't resolve 'babel' in 'C:\Users\messi\New folder' @ multi babel-polyfill ./src/client/index main[1] #93

Open
tiesto429 opened this issue Oct 4, 2018 · 2 comments

Comments

@tiesto429
Copy link

I am getting this error on build:
**Generating minified bundle for production via Webpack. This will take a moment... (node:117912) DeprecationWarning: Tapable.plugin is deprecated. Use new API on .hooks` instead
(node:117912) DeprecationWarning: Chunk.mapModules: Use Array.from(chunk.modulesIterable, fn) instead
Webpack stats: Hash: 2563da8cbef0bd4e0876
Version: webpack 4.20.2
Time: 5557ms
Built at: 2018-10-04 14:32:18
Asset Size Chunks Chunk Names
main.1104bafcd2688cdd4861.js 88.1 KiB 0 main
Entrypoint main = main.1104bafcd2688cdd4861.js
[90] (webpack)/buildin/global.js 509 bytes {0} [built]
[109] ./node_modules/core-js/modules/es6.regexp.flags.js 201 bytes {0} [built]
[112] ./node_modules/core-js/modules/es6.map.js 642 bytes {0} [built]
[114] ./node_modules/core-js/modules/es6.set.js 481 bytes {0} [built]
[115] ./node_modules/core-js/modules/es6.weak-map.js 1.92 KiB {0} [built]
[125] multi babel-polyfill ./src/client/index 40 bytes {0} [built]
[126] ./node_modules/babel-polyfill/lib/index.js 833 bytes {0} [built]
[127] ./node_modules/core-js/shim.js 7.99 KiB {0} [built]
[164] ./node_modules/core-js/modules/es6.number.parse-int.js 221 bytes {0} [built]
[216] ./node_modules/core-js/modules/es6.array.sort.js 643 bytes {0} [built]
[320] ./node_modules/core-js/modules/es7.observable.js 5.39 KiB {0} [built]
[321] ./node_modules/core-js/modules/web.timers.js 754 bytes {0} [built]
[322] ./node_modules/core-js/modules/web.immediate.js 162 bytes {0} [built]
[324] ./node_modules/regenerator-runtime/runtime.js 23.9 KiB {0} [built]
[325] ./node_modules/core-js/fn/regexp/escape.js 108 bytes {0} [built]
+ 313 hidden modules

WARNING in main.1104bafcd2688cdd4861.js contains invalid source map

ERROR in multi babel-polyfill ./src/client/index
Module not found: Error: Can't resolve 'babel' in 'C:\Users\rdodle\New folder'
@ multi babel-polyfill ./src/client/index main[1]
Child html-webpack-plugin for "index.html":
Asset Size Chunks Chunk Names
index.html 534 KiB 0
Entrypoint undefined = index.html
[0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/client/index.ejs 2.1 KiB {0} [built]
[1] ./node_modules/lodash/lodash.js 527 KiB {0} [built]
[2] (webpack)/buildin/global.js 509 bytes {0} [built]
[3] (webpack)/buildin/module.js 519 bytes {0} [built]
Your app is compiled in production mode in /dist. It's ready to roll!`**

My Webpack.config.prod.js

// For info about this file refer to webpack and webpack-hot-middleware documentation
// For info on how we're generating bundles with hashed filenames for cache busting: https://medium.com/@okonetchnikov/long-term-caching-of-static-assets-with-webpack-1ecb139adb95#.w99i89nsz
import webpack from 'webpack';
import path from 'path';
// import ExtractTextPlugin from 'extract-text-webpack-plugin';
import WebpackMd5Hash from 'webpack-md5-hash';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import jsonImporter from 'node-sass-json-importer';
if (!global._babelPolyfill) {
require('babel-polyfill');
}
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");

const GLOBALS = {
'process.env.NODE_ENV': JSON.stringify('production'),
DEV: false
};

export default {
mode:"production",
// debug: true,
devtool: 'source-map', // more info:https://webpack.github.io/docs/build-performance.html#sourcemaps and https://webpack.github.io/docs/configuration.html#devtool
// noInfo: true, // set to false to see a list of every file being bundled.
entry: [
'babel-polyfill',
'./src/client/index'
],
output:{
path: path.resolve(__dirname, "dist"), // string
// the target directory for all output files
// must be an absolute path (use the Node.js path module)
filename: '[name].[chunkhash].js', // string // the filename template for entry chunks
publicPath: "/" // string // the url to the output directory resolved relative to the HTML page
},
target: 'web', // necessary per https://webpack.github.io/docs/testing.html#compile-and-test
// output: {
// path: ${__dirname}/dist,
// publicPath: '/',
// filename: '[name].[chunkhash].js'
// },
resolve: {
alias: {
'webworkify': 'webworkify-webpack'
}
},
plugins: [
new webpack.LoaderOptionsPlugin({
debug: true
}),
// Hash the files using MD5 so that their names change when the content changes.
new WebpackMd5Hash(),

// Optimize the order that inspiration are bundled. This assures the hash is deterministic.
new webpack.optimize.OccurrenceOrderPlugin(),

// Tells React to build in prod mode. https://facebook.github.io/react/downloads.html
// --optimize-dedupe resp. new webpack.optimize.DedupePlugin(GLOBALS),

// Generate an external css file with a hash in the filename
new ExtractTextPlugin('[name].[contenthash].css'),

// Generate HTML file that contains references to generated bundles. See here for how this works: https://github.com/ampedandwired/html-webpack-plugin#basic-usage
new HtmlWebpackPlugin({
  template: 'src/client/index.ejs',
  minify: {
    removeComments: true,
    collapseWhitespace: true,
    removeRedundantAttributes: true,
    useShortDoctype: true,
    removeEmptyAttributes: true,
    removeStyleLinkTypeAttributes: true,
    keepClosingSlash: true,
    minifyJS: true,
    minifyCSS: true,
    minifyURLs: true
  },
  inject: true
  // Note that you can add custom options here if you need to handle other custom logic in index.html
}),

// Eliminate duplicate packages when generating bundle
// new webpack.optimize.DedupePlugin(),

// Minify JS
new UglifyJsPlugin()

],
module: {
// configuration regarding modules
rules: [
{
test: /.scss$/,
use: [
// apply multiple loaders and options
"sassLoader",
{
loader: "sassLoader",
options: {
importer: jsonImporter
}
}
]
},
{
test: /.js$/,
include: path.join(__dirname, 'src'),
use: "babel"
},
{
test: /webworkify.+.js$/,
include: path.resolve(__dirname, 'node_modules/webworkify/index.js'),
use: 'worker'
},
{
test: /.eot(?v=\d+.\d+.\d+)?$/,
use: 'file'
},
{
test: /.woff(2)?(?v=[0-9].[0-9].[0-9])?$/,
use: "url-loader?limit=10000&mimetype=application/font-woff"
},
{
test: /.[ot]tf(?v=\d+.\d+.\d+)?$/,
use: 'url?limit=10000&mimetype=application/octet-stream&name=[name].[ext]'
},
{
test: /.svg(?v=\d+.\d+.\d+)?$/,
use: 'file-loader?limit=10000&mimetype=image/svg+xml'},
{
test: /.(jpe?g|png|gif)$/i,
use: ['file']},
{
test: /.ico$/,
use: 'file-loader?name=[name].[ext]'},
{
test: /(.css|.scss)$/,
use: ExtractTextPlugin.extract('css?sourceMap!postcss!resolve-url-loader!sass?sourceMap')
},
{
test: /.json$/,
use: 'json'
},
{
enforce:'post',
include: /node_modules/mapbox-gl/,
loader: 'transform',
query: 'brfs'
}
]
}
};

@ghost
Copy link

ghost commented Jan 3, 2019

I was facing same issue. I found that one of my custom plugin has error. After fixing that things worked fine

@iyasmavoor
Copy link

i also face same problem

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

module.exports={
entry:['babel-polifill','./src/js/index.js'],
output:{
path:path.resolve(__dirname,'dist'),
filename:'js/bundle.js'
},
plugins:[
new HtmlWebpackPlugin({
filename:'index.html',
template : './src/index.html'
})
],
module:{
rules:[
{
test:/.js$/,
exclude:/node_modules/,
use:{
loader:'babel-loader'
}
}
]
}

};`

but the error comes as

ERROR in multi babel-polifill ./src/js/index.js
Module not found: Error: Can't resolve 'babel-polifill' in 'C:\Users\Acer\Desktop\9-forkify\starter'
@ multi babel-polifill ./src/js/index.js main[0]
Child HtmlWebpackCompiler:
1 asset
Entrypoint HtmlWebpackPlugin_0 = __child-HtmlWebpackPlugin_0
[./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html] 18.3 KiB {HtmlWebpackPlugin_0} [built]
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! [email protected] dev: webpack --mode development
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Acer\AppData\Roaming\npm-cache_logs\2020-06-04T14_58_41_820Z-debug.log

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants