WebPack: Entrypoint underfined
I am doing one of the Tutorial of using React, WebPack and Babel together.
While everything worked as intended(built, compile, and render correctly).
I am getting an error from webpack, that said
Child html-webpack-plugin for "index.html":
1 asset
Entrypoint undefined = ./index.html
[0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 666 bytes {0} [built]
My WebPack configuration file looks like following:
const HtmlWebPackPlugin = require("html-webpack-plugin");
module.exports = {
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
},
{
test: /.html$/,
use: [
{
loader: "html-loader"
}
]
}
]
},
plugins: [
new HtmlWebPackPlugin({
template: "./src/index.html",
filename: "./index.html"
})
]
};
And My file structure looks like this:
WebPack_Demo
-dist
-node_modules
-src
-javascript
-components
-Component1.js
-Component2.js
-index.html
-index.js
-.babelrc
- package-lock.json
- webpack.config.js
Someone else is also getting the error following this tutorial but the author does not address that. Even though it does not affect the app, I still wanted to know how to get rid of this error.
webpack html-webpack-plugin
asked Nov 14 '18 at 19:52
aDevaDev
19511
add a comment |
I am doing one of the Tutorial of using React, WebPack and Babel together.
While everything worked as intended(built, compile, and render correctly).
I am getting an error from webpack, that said
Child html-webpack-plugin for "index.html":
1 asset
Entrypoint undefined = ./index.html
[0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 666 bytes {0} [built]
My WebPack configuration file looks like following:
const HtmlWebPackPlugin = require("html-webpack-plugin");
module.exports = {
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
},
{
test: /.html$/,
use: [
{
loader: "html-loader"
}
]
}
]
},
plugins: [
new HtmlWebPackPlugin({
template: "./src/index.html",
filename: "./index.html"
})
]
};
And My file structure looks like this:
WebPack_Demo
-dist
-node_modules
-src
-javascript
-components
-Component1.js
-Component2.js
-index.html
-index.js
-.babelrc
- package-lock.json
- webpack.config.js
Someone else is also getting the error following this tutorial but the author does not address that. Even though it does not affect the app, I still wanted to know how to get rid of this error.
webpack html-webpack-plugin
asked Nov 14 '18 at 19:52
aDevaDev
19511
add a comment |
I am doing one of the Tutorial of using React, WebPack and Babel together.
While everything worked as intended(built, compile, and render correctly).
I am getting an error from webpack, that said
Child html-webpack-plugin for "index.html":
1 asset
Entrypoint undefined = ./index.html
[0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 666 bytes {0} [built]
My WebPack configuration file looks like following:
const HtmlWebPackPlugin = require("html-webpack-plugin");
module.exports = {
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
},
{
test: /.html$/,
use: [
{
loader: "html-loader"
}
]
}
]
},
plugins: [
new HtmlWebPackPlugin({
template: "./src/index.html",
filename: "./index.html"
})
]
};
And My file structure looks like this:
WebPack_Demo
-dist
-node_modules
-src
-javascript
-components
-Component1.js
-Component2.js
-index.html
-index.js
-.babelrc
- package-lock.json
- webpack.config.js
Someone else is also getting the error following this tutorial but the author does not address that. Even though it does not affect the app, I still wanted to know how to get rid of this error.
webpack html-webpack-plugin
asked Nov 14 '18 at 19:52
aDevaDev
19511
I am doing one of the Tutorial of using React, WebPack and Babel together.
While everything worked as intended(built, compile, and render correctly).
I am getting an error from webpack, that said
Child html-webpack-plugin for "index.html":
1 asset
Entrypoint undefined = ./index.html
[0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 666 bytes {0} [built]
My WebPack configuration file looks like following:
const HtmlWebPackPlugin = require("html-webpack-plugin");
module.exports = {
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
},
{
test: /.html$/,
use: [
{
loader: "html-loader"
}
]
}
]
},
plugins: [
new HtmlWebPackPlugin({
template: "./src/index.html",
filename: "./index.html"
})
]
};
And My file structure looks like this:
WebPack_Demo
-dist
-node_modules
-src
-javascript
-components
-Component1.js
-Component2.js
-index.html
-index.js
-.babelrc
- package-lock.json
- webpack.config.js
Someone else is also getting the error following this tutorial but the author does not address that. Even though it does not affect the app, I still wanted to know how to get rid of this error.
webpack html-webpack-plugin
webpack html-webpack-plugin
asked Nov 14 '18 at 19:52
aDevaDev
19511
asked Nov 14 '18 at 19:52
aDevaDev
19511
asked Nov 14 '18 at 19:52
aDevaDev
19511
asked Nov 14 '18 at 19:52
aDevaDev
19511
asked Nov 14 '18 at 19:52
aDevaDev
19511
19511
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
I think you should add the "entry" and "output" properties to your webpack config file.
Your output should have a "path" pointing to a folder where the bundled files are stored.
Then the "filename" in HtmlWebpackPlugin should point to that folder
This is how is mine setup:
const path = require('path');
module.exports = {
entry: {
app: path.resolve(__dirname, '.','index.js')
},
output: {
path: path.resolve(__dirname, '.', 'build'), // ATTENTION
publicPath: '/',
filename: '[name].js'
},
devtool: 'source-map',
plugins: [
new HtmlWebpackPlugin({
template: path.resolve('.', 'src', 'index.html'),
chunks: [chunks],
filename: path.join('.', 'build', 'index.html'), // ATTENTION
}),
....
],
....
}
answered Nov 15 '18 at 4:48
xeitonxeiton
2866
what does template do?
– aDev
Nov 15 '18 at 14:07
Template is the path to your basic html file. Webpack will inject all the dependencies (js, css) to it at the compile time.
– xeiton
Nov 16 '18 at 12:45
Ok,but aren't entry point and output not required in Webpack 4 tho?
– aDev
Nov 16 '18 at 14:20
There are many things that are optional, but you will have to set them up for certain things to happen... If my answer helped please upvote or accept as an answer. Thank you.
– xeiton
Nov 17 '18 at 15:25
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53307811%2fwebpack-entrypoint-underfined%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
I think you should add the "entry" and "output" properties to your webpack config file.
Your output should have a "path" pointing to a folder where the bundled files are stored.
Then the "filename" in HtmlWebpackPlugin should point to that folder
This is how is mine setup:
const path = require('path');
module.exports = {
entry: {
app: path.resolve(__dirname, '.','index.js')
},
output: {
path: path.resolve(__dirname, '.', 'build'), // ATTENTION
publicPath: '/',
filename: '[name].js'
},
devtool: 'source-map',
plugins: [
new HtmlWebpackPlugin({
template: path.resolve('.', 'src', 'index.html'),
chunks: [chunks],
filename: path.join('.', 'build', 'index.html'), // ATTENTION
}),
....
],
....
}
answered Nov 15 '18 at 4:48
xeitonxeiton
2866
what does template do?
– aDev
Nov 15 '18 at 14:07
Template is the path to your basic html file. Webpack will inject all the dependencies (js, css) to it at the compile time.
– xeiton
Nov 16 '18 at 12:45
Ok,but aren't entry point and output not required in Webpack 4 tho?
– aDev
Nov 16 '18 at 14:20
There are many things that are optional, but you will have to set them up for certain things to happen... If my answer helped please upvote or accept as an answer. Thank you.
– xeiton
Nov 17 '18 at 15:25
add a comment |
I think you should add the "entry" and "output" properties to your webpack config file.
Your output should have a "path" pointing to a folder where the bundled files are stored.
Then the "filename" in HtmlWebpackPlugin should point to that folder
This is how is mine setup:
const path = require('path');
module.exports = {
entry: {
app: path.resolve(__dirname, '.','index.js')
},
output: {
path: path.resolve(__dirname, '.', 'build'), // ATTENTION
publicPath: '/',
filename: '[name].js'
},
devtool: 'source-map',
plugins: [
new HtmlWebpackPlugin({
template: path.resolve('.', 'src', 'index.html'),
chunks: [chunks],
filename: path.join('.', 'build', 'index.html'), // ATTENTION
}),
....
],
....
}
answered Nov 15 '18 at 4:48
xeitonxeiton
2866
what does template do?
– aDev
Nov 15 '18 at 14:07
Template is the path to your basic html file. Webpack will inject all the dependencies (js, css) to it at the compile time.
– xeiton
Nov 16 '18 at 12:45
Ok,but aren't entry point and output not required in Webpack 4 tho?
– aDev
Nov 16 '18 at 14:20
There are many things that are optional, but you will have to set them up for certain things to happen... If my answer helped please upvote or accept as an answer. Thank you.
– xeiton
Nov 17 '18 at 15:25
add a comment |
I think you should add the "entry" and "output" properties to your webpack config file.
Your output should have a "path" pointing to a folder where the bundled files are stored.
Then the "filename" in HtmlWebpackPlugin should point to that folder
This is how is mine setup:
const path = require('path');
module.exports = {
entry: {
app: path.resolve(__dirname, '.','index.js')
},
output: {
path: path.resolve(__dirname, '.', 'build'), // ATTENTION
publicPath: '/',
filename: '[name].js'
},
devtool: 'source-map',
plugins: [
new HtmlWebpackPlugin({
template: path.resolve('.', 'src', 'index.html'),
chunks: [chunks],
filename: path.join('.', 'build', 'index.html'), // ATTENTION
}),
....
],
....
}
answered Nov 15 '18 at 4:48
xeitonxeiton
2866
I think you should add the "entry" and "output" properties to your webpack config file.
Your output should have a "path" pointing to a folder where the bundled files are stored.
Then the "filename" in HtmlWebpackPlugin should point to that folder
This is how is mine setup:
const path = require('path');
module.exports = {
entry: {
app: path.resolve(__dirname, '.','index.js')
},
output: {
path: path.resolve(__dirname, '.', 'build'), // ATTENTION
publicPath: '/',
filename: '[name].js'
},
devtool: 'source-map',
plugins: [
new HtmlWebpackPlugin({
template: path.resolve('.', 'src', 'index.html'),
chunks: [chunks],
filename: path.join('.', 'build', 'index.html'), // ATTENTION
}),
....
],
....
}
answered Nov 15 '18 at 4:48
xeitonxeiton
2866
answered Nov 15 '18 at 4:48
xeitonxeiton
2866
answered Nov 15 '18 at 4:48
xeitonxeiton
2866
answered Nov 15 '18 at 4:48
xeitonxeiton
2866
2866
what does template do?
– aDev
Nov 15 '18 at 14:07
Template is the path to your basic html file. Webpack will inject all the dependencies (js, css) to it at the compile time.
– xeiton
Nov 16 '18 at 12:45
Ok,but aren't entry point and output not required in Webpack 4 tho?
– aDev
Nov 16 '18 at 14:20
There are many things that are optional, but you will have to set them up for certain things to happen... If my answer helped please upvote or accept as an answer. Thank you.
– xeiton
Nov 17 '18 at 15:25
add a comment |
what does template do?
– aDev
Nov 15 '18 at 14:07
Template is the path to your basic html file. Webpack will inject all the dependencies (js, css) to it at the compile time.
– xeiton
Nov 16 '18 at 12:45
Ok,but aren't entry point and output not required in Webpack 4 tho?
– aDev
Nov 16 '18 at 14:20
There are many things that are optional, but you will have to set them up for certain things to happen... If my answer helped please upvote or accept as an answer. Thank you.
– xeiton
Nov 17 '18 at 15:25
what does template do?
– aDev
Nov 15 '18 at 14:07
what does template do?
– aDev
Nov 15 '18 at 14:07
Template is the path to your basic html file. Webpack will inject all the dependencies (js, css) to it at the compile time.
– xeiton
Nov 16 '18 at 12:45
Template is the path to your basic html file. Webpack will inject all the dependencies (js, css) to it at the compile time.
– xeiton
Nov 16 '18 at 12:45
Ok,but aren't entry point and output not required in Webpack 4 tho?
– aDev
Nov 16 '18 at 14:20
Ok,but aren't entry point and output not required in Webpack 4 tho?
– aDev
Nov 16 '18 at 14:20
There are many things that are optional, but you will have to set them up for certain things to happen... If my answer helped please upvote or accept as an answer. Thank you.
– xeiton
Nov 17 '18 at 15:25
There are many things that are optional, but you will have to set them up for certain things to happen... If my answer helped please upvote or accept as an answer. Thank you.
– xeiton
Nov 17 '18 at 15:25
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53307811%2fwebpack-entrypoint-underfined%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
