でのレンダリングではありません。VUEのHTMLタグがちょうどWebPACKのと私の初の電子& vue.jsアプリを設定しようとすると、私のVUEコンポーネントがレンダリング取得されていない問題に実行している電子
var path = require('path')
var webpack = require('webpack')
module.exports = {
entry: './app/main.js',
output: {
path: path.resolve(__dirname, './dist'),
filename: 'bundle.js'
},
module: {
loaders: [
{
test: /\.vue$/,
use: {
loader: 'vue-loader'
}
},
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['es2015'],
plugins: ['transform-runtime']
}
}
}
]
},
plugins: [
new webpack.ExternalsPlugin('commonjs', [
'electron'
])
]
}
main.js(電子エントリポイント):(電子によってレンダリング)
const electron = require('electron');
const app = electron.app;
const BrowserWindow = electron.BrowserWindow;
let mainWindow;
var createWindow =() => {
mainWindow = new BrowserWindow({width: 800, height: 600});
mainWindow.loadURL('file://' + __dirname + '/index.html');
mainWindow.on('closed',() => mainWindow = null);
}
app.on('ready', createWindow);
app.on('window-all-closed',() => {
if (process.platform !== 'darwin') {
app.quit();
}
});
app.on('activate',() => {
if (mainWindow === null) {
createWindow();
}
});
のindex.html:ここ
webpack.config.jsあります
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<app></app>
<script src="dist/bundle.js"></script>
</body>
</html>
APP/App.vue(VUEルートコンポーネント):
<template>
<div>{{ msg }}</div>
</template>
<script>
export default {
data() {
return {
msg: "root component"
}
}
}
</script>
APP/main.js(WebPACKのエントリポイント):
import Vue from 'vue'
import App from './App.vue'
new Vue({
el: 'app',
components: { App }
})
それからことなく実行bundle.jsを作成するWebPACKの実行何か問題がある。私は、スタート(別名電子main.js)を実行NPM実行したときしかし、私は空白の画面を取得し、私はそれがアプリタグが欠落しているように見えるコードを検査する場合:
私は「エルを変更した場合: "app" 'to' el: "body" '全身がなくても。
これはこのテクノロジに対処する私の最初の試みであり、何が間違っているのかはわかりません。