I am using webpack 1.13.1
I get this error when I want to run webpack
Module not found: Error: Cannot resolve 'file' or 'directory'
/home/tetar/grails-reactjs-master/src/main/js
resolve file
/home/tetar/grails-reactjs-master/src/main/js/undefined doesn't exist
/home/tetar/grails-reactjs-master/src/main/js/undefined.webpack-
loader.js doesn't exist [...]
[/home/tetar/grails-reactjs-master/src/main/js/undefined.js]
# ./src/main/js/test.js 3:0-21
In my test.js I only have 2 test line
require ('./test.css');
module.exports = "test fail"
and there is my webpack config
var path = require('path');
var root = path.resolve(__dirname);
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var extractCSS = new ExtractTextPlugin('bundle.css');
module.exports = {
entry: {
index: ['./src/main/js/index.js']
},
output: {
path: path.resolve(__dirname, './grails-app/assets/javascripts'),
publicPath: '/assets/',
filename: 'bundle.js'
},
module: {
loaders: [
{
test: /\.js$/,
loader: 'babel',
exclude: /node_modules/,
include : root
},
{
test: /\.css$/,
loaders : extractCSS.extract(['css'])
}
]
}
};
do you have any idea how to solve this problem ?
Related
When I try gulp scipts, it throws me the following error
ERROR in Entry module not found:
Error: Can't resolve 'C:/Users/milan/Local
Sites/project-university/app/public/wp-content/themes/fictional-university-theme/js/scripts.js'
in 'C:\Users\milan\Local Sites\project-university\app\public'
below is my webpack.config.js
const path = require('path'),
settings = require('./settings');
module.exports = {
entry: {
App: settings.themeLocation + "js/scripts.js"
},
output: {
path: path.resolve(__dirname, settings.themeLocation + "js"),
filename: "scripts-bundled.js"
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['#babel/preset-env']
}
}
}
]
},
mode: 'development'
}
and my settings.js :
exports.urlToPreview = 'http://project-university.local/';
exports.themeLocation =
'C:/Users/milan/Local Sites/project-university/app/public/wp-content/themes/fictional-university-theme/';
Below is my file directory,
Project---- app------ public----------(wordpress content files)
The problem is the compiling path defined in settings.js. Change the defined path from
exports.themeLocation = './public/wp-content/themes/fictional-university-theme/';
to
exports.themeLocation = './wp-content/themes/fictional-university-theme/';
I'm trying to use webpack to bundle my backend code. It's currently using vanilla node.js where I'm using module.exports.x, and when I run webpack, it also outputs the export line i.e. module.exports.x. Now the problem is when I run nodemon on the file, it gives me the error TypeError: Cannot set property 'x' of undefined.
What's my resolution here?
my config file.
"use strict"
const path = require("path")
// const utils = require("./utils")
// const config = require("../config")
var fs = require("fs")
const NodemonPlugin = require("nodemon-webpack-plugin")
const nodeExternals = require("webpack-node-externals")
function resolve(dir)
{
return path.join(__dirname, "..", dir)
}
module.exports = {
context: path.resolve(__dirname, "../"),
entry: "./src/server/server.js",
output: {
path: path.resolve(__dirname, "../src/server"),
filename: "server-webpack.js",
},
plugins: [
new NodemonPlugin(),
],
resolve: {
extensions: [".js",".ts", ".tsx"],
alias: {
"#": resolve("src"),
"#": resolve("src/server")
}
},
devtool: "#inline-source-map",
module: {
rules: [
{
test: /\.js$/,
loader: "babel-loader",
include: [resolve("src"), resolve("test")]
},
{
test: /\.tsx?$/,
loader: "ts-loader",
},
]
},
externals: [
nodeExternals()
],
target: "node"
}
Entry file will build literally just fine, but the error occurs on client side, which makes the whole bundle file doesn't work with this issue Uncaught TypeError: Cannot read property 'Blob' of undefined
and i have attached the webpack.config.js which i have tried too
const path = require('path')
const webpack = require('webpack')
const HtmlPlugin = require('html-webpack-plugin')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const config = {
entry: './src/main-entry.js',
output: {
path: path.resolve(__dirname, 'views/dist'),
filename: 'bundle.js'
},
module: {
rules: [
{ test: /\.(png|woff|woff2|eot|ttf|svg|gif)$/, loader: 'url-loader?limit=100000' },
{
test: /\.css$/,
use: ExtractTextPlugin.extract({
use: 'css-loader', fallback: 'style-loader'
})
},
{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/
}
]
},
plugins: [
new ExtractTextPlugin('bundle.css'),
new webpack.optimize.UglifyJsPlugin({
include: /\.min\.js$/,
minimize: true
})
]
}
module.exports = config
I am using webpack latest version. But i don't know why this is happening? can you help me?
When I try to run npm run webpack, this shows "Error: 'output.filename' is required, either in config file or as --output-filename."
The config file is named correctly as webpack.config.js and is also in the root directory.
Below is the content in the config file:
var path = require('path');
var webpack = require('webpack');
module.exports - {
entry: './app.js',
output: { path: __dirname, filename: 'bundle.js' },
module: {
loaders: [
{
test: /.jsx?$/,
loader: 'babel-loader',
exclude: /node-modules/,
query: {
presets: ['es2015', 'react']
}
}
]
},
};
Would really appreciate help
You have a syntax error.
module.exports -
should be:
module.exports =
And btw, you do not need to require webpack in the configuration file.
I'm working on an Electron app which requires the code highlighting feature. I installed highlight module as a node dependency and use webpack to bundle all the code into the app.bundle.js.
However, when I launch the Electron app, I notice an error from the highlight module complaining
Uncaught Error: ENOENT: no such file or directory, scandir '//vendor/highlight.js/languages/'
Inside app.bundle.js, the highlight module still uses the vendor/highlight.js/languages/ to search for its utilities files which I thought should be included into app.bundle.js with their paths updated.
var Highlight = module.exports
, fs = __webpack_require__(336)
, hljs = __webpack_require__(408).hljs
, langRelPath = "vendor/highlight.js/languages/"
, langPath = __dirname + "/" + langRelPath
, reEndsWithJs = /\.js$/i
, loadedMap = {}
, availableMap = {}
;
It's my first time to use webpack, so it might be caused by some webpack misconfigurations. I paste the webpack.config.js for your convenience.
'use strict'
const path = require('path');
const webpack = require('webpack');
module.exports = {
entry: [
'./app/app.js'
],
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'app.bundle.js'
},
module: {
loaders: [{
test: /\.js$/,
include: [path.resolve(__dirname, 'app')],
exclude: /node_modules/,
loaders: ['babel?presets[]=es2015,presets[]=react']
}, {
test: /\.(scss|css)$/,
loaders: ['style', 'css', 'sass']
}, {
test: /\.json/,
loader: 'json'
}, {
test: /\.(png|jpg)$/,
loader: 'url-loader'
}, {
test: /\.html$/,
loader: 'html'
}, {
test: /\.txt$/,
loader: 'text'
}]
},
target: 'electron'
};
Does anyone have some idea for this?
(Everything works fine when not bundle by webpack.)
Thank you in advance:)