任何人都可以指引我朝着正确的方向前进吗?
所以我使用松露套件演示设置了webpack-dev-server,只是为了获得我的应用程序的基础。所以我的配置文件包括index.html& app.js,但它试图从app.js显示一个console.log输出,没有通过控制台显示?
webpack.config.js
const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');
module.exports =
{
entry: './app/javascripts/app.js',
output: {
path: path.resolve(__dirname, 'build'),
filename: 'app.js',
},
plugins: [
// Copy our app's index.html to the build folder.
new CopyWebpackPlugin([
{ from: './app/index.html', to: "index.html" }
])
],
module: {
rules: [
{
test: /\.css$/,
use: [ 'style-loader', 'css-loader' ]
}
],
loaders: [
{ test: /\.json$/, use: 'json-loader' },
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel-loader',
query: {
presets: ['es2015'],
plugins: ['transform-runtime']
}
}
]
},
devServer: {
compress: true,
disableHostCheck: true, // That solved .
quiet: false,
noInfo: false,
stats: {
// Config for minimal console.log mess.
colors: true,
version: false,
hash: false,
timings: false,
chunks: false,
chunkModules: false
}
}
}
app.js
// Import libraries we need.
import { default as Web3} from 'web3';
import { default as contract } from 'truffle-contract'
// Import our contract artifacts and turn them into usable abstractions.
import metacoin_artifacts from '../../build/contracts/MetaCoin.json'
import dextre_artifacts from '../../build/contracts/Dextre.json'
console.log("starting!");
运行webpack时的输出
Project is running at http://localhost:8080/
webpack output is served from /
Asset Size Chunks Chunk Names
app.js 1.93 MB 0 [emitted] [big] main
index.html 19.8 kB [emitted]
webpack: Compiled successfully.
哪里可以查看"开始!"输出,这是一个真正的烦恼,因为我需要解决错误。我曾尝试在http://localhost:8080//和http://localhost:8080/webpack-dev-server//查看,但没有运气。
答案 0 :(得分:1)
由于您使用的是 webpack-dev-server
,因此 console.log
将被打印到浏览器控制台中。如果您想在终端中看到 console.log
,您可以在 console.log
文件中添加一个 webpack.config
。
如果您没有提供 webpack-dev-server
端口,您的应用程序应该在 80 上运行,因此在那里打开浏览器并打开浏览器控制台,您应该能够看到 "starting!
日志。
答案 1 :(得分:0)
所以console.log在chrome中发布到控制台开发窗口,所以至少我可以查看我的错误。
我已经尝试过window.console.log和window.console.warn,但没有运气,如果有人确实对webpack控制台窗口中的显示输出有响应,那将非常感激。
欢呼帮助;)
答案 2 :(得分:0)
我有同样的问题。据我所知,问题是Webpack实际上没有在服务器上运行生成的代码。在服务器上运行的进程仅检查文件更改并在必要时重新编译。该代码实际上全部在客户端上运行。因此,查看console.log()的输出的唯一方法是查看客户端浏览器的控制台。
这里的部分困惑在于,尽管通常情况下,节点在服务器上运行javascript,但在这种情况下,节点完全委派给了一个单独的程序。您可以只安装webpack可执行文件的独立安装,而无需安装任何节点即可运行整个过程。从未使用过Node的执行环境,因此您无法登录。