我在创建基本webpack项目时得到了关注
未捕获错误:无法找到模块"运行" 在webpackMissingModule(bootstrap 487ed85 ...:62) 在Object.5(bootstrap 487ed85 ...:62) 在 webpack_require (bootstrap 487ed85 ...:19) 在bootstrap 487ed85 ......:62 在bootstrap 487ed85 ...:62
我的代码如下 的 webpack.config.js
var path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack');
module.exports = {
entry: {
app: './src/scripts/index.js',
print: './src/scripts/print.js'
},
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist/scripts/')
},
devtool: 'inline-source-map',
devServer: {
contentBase: './dist',
hot: true,
port: 9000
},
plugins: [
//new CleanWebpackPlugin(['dist']),
new HtmlWebpackPlugin({
title: 'Output Management',
filename: '../index.html',
template: 'src/index.html'
}),
new webpack.HotModuleReplacementPlugin()
],
module: {
rules: [
{
test: /\.css$/,
use: [
'style-loader',
'css-loader'
]
}
]
}
};
的package.json
{
"name": "webpack-site",
"version": "1.0.0",
"description": "",
"main": "index.js",
"dependencies": {
"lodash": "^4.17.4",
"webpack": "^3.3.0"
},
"devDependencies": {
"clean-webpack-plugin": "^0.1.16",
"css-loader": "^0.28.4",
"file-loader": "^0.11.2",
"html-webpack-plugin": "^2.29.0",
"style-loader": "^0.18.2",
"webpack-dev-middleware": "^1.11.0",
"webpack-hot-middleware": "^2.18.2"
},
"scripts": {
"watch": "webpack --watch",
"start": "webpack-dev-server --open",
"build": "webpack"
},
"author": "nabaraj",
"license": "ISC"
}
index.js
import _ from 'lodash';
import printMe from './print.js';
import '../css/style.css';
if (module.hot) {
module.hot.accept('./print.js', function () {
console.log('Accepting the updated printMe module!');
printMe();
document.body.removeChild(element);
element = component(); // Re-render the "component" to update the click handler
document.body.appendChild(element);
})
}
function component() {
var element = document.createElement('div');
var btn = document.createElement('button');
element.innerHTML = _.join(['Hello', 'webpack'], ' ');
btn.innerHTML = 'Click me and check the console!';
btn.onclick = printMe;
element.appendChild(btn);
return element;
}
document.body.appendChild(component());
无法找出根本原因。此外,css没有添加到头部。