SimulatedGREG / electron-vue

An Electron & Vue.js quick start boilerplate with vue-cli scaffolding, common Vue plugins, electron-packager/electron-builder, unit/e2e testing, vue-devtools, and webpack.
https://simulatedgreg.gitbooks.io/electron-vue/content/
MIT License
15.48k stars 1.55k forks source link

ERROR in unknown: Unexpected token (52869:68) #907

Closed pjtsearch closed 4 years ago

pjtsearch commented 5 years ago

Found an issue or bug with electron-vue? Tell me all about it!

Questions regarding how to use electron or vue are likely to be closed as they are not direct issues with this boilerplate. Please seek solutions from official documentation or their respective communities.

Describe the issue / bug.

When running yarn build, it fails to build the renderer process.

How can I reproduce this problem?

It is unclear what the error relates to.

Logs

er/pages/Home/index.vue?vue&type=template&id=b2c35388& 469 bytes [built] | ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/renderer/pages/Home/index.vue?vue&type=script&lang =js& 2.41 KiB [built] | ./src/renderer/pages/Home/VMList.vue 461 bytes [built] | ./src/renderer/pages/Home/VMList.vue?vue&type=template&id=f0df2542& 216 bytes [built] | ./src/renderer/pages/Home/VMList.vue?vue&type=script&lang=js& 374 bytes [built] | ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/render er/pages/Home/VMList.vue?vue&type=template&id=f0df2542& 881 bytes [built] | ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/renderer/pages/Home/VMList.vue?vue&type=script&lan g=js& 326 bytes [built]

error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Tell me about your development environment.
bigfarofa commented 5 years ago

I had a similar problem. In development yarn dev was working, but broke the build. My problem was how I imported the package. I solved with this:

import Excel from "exceljs/modern.browser"; // Breaks Build
import Excel from "exceljs"; // Didn't break the build

My debug process was: 1 - Create a clean electron-vue project 2 - Copy ONE page/view (the components that are in the /src/routes/index.js) from the project with broken build to the new project. 3 - Build it 4 - Repeat process step 2 and 3 until it the build fails 5 - Once I know which component is giving trouble, remove all content from the <template></temlate> and just leave the imports like this:

<template></template>
<script>
import package1 from 'package1'
import package2 from 'package2'
import package3 from 'package2'
export default {
}
</script>

6 - remove/comment one import and build it. Comment another one and built it. Do this process until the build is successfull.

7 - Once you know which package is giving trouble try to check what is causing the problem. In my case was the previous mentioned exceljs import

TL:DR

ideacco commented 5 years ago

I also have a similar error.

    Child html-webpack-plugin for "index.html":
             Asset     Size  Chunks  Chunk Names
        index.html  557 KiB       0  
        Entrypoint undefined = index.html
        [0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.ejs 1.14 KiB {0} [built]
        [1] ./node_modules/lodash/lodash.js 528 KiB {0} [built]
        [2] (webpack)/buildin/module.js 497 bytes {0} [built]
lcotonea commented 5 years ago

Same error. In development everything seems fine but in production, index.html seems not be created.

ERROR in unknown: Unexpected token (29099:66) Child html-webpack-plugin for "index.html": Asset Size Chunks Chunk Names index.html 533 KiB 0
Entrypoint undefined = index.html [0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.ejs 1.21 KiB {0} [built] [1] ./node_modules/lodash/lodash.js 528 KiB {0} [built] [2] (webpack)/buildin/module.js 497 bytes {0} [built]

After investigations, HtmlWebpack was not the origin of the problem. In general, this is another plugin which is the cause of the problem. The correct way to discover the root cause is to unable all unnecessary plugins and launch build until the sick plugin is found.

An enhancement could be to have a better logging return.

thrazu commented 5 years ago

Have the same error in building my app and I found a temporary solution. I've commented out the BabiliWebpackPlugin in webpack.renderer.config.js. I got no errors for now and the building process works fine. I'm wondering if this plugin is really necessary...

lcotonea commented 5 years ago

I confirm. In my case, the problem was the same.

9646516 commented 4 years ago

I meet the same problem,and I fix it by comment out BabiliWebpackPlugin in webpack.renderer.config.js

XanderLuciano commented 4 years ago

Merged #904 which should fix this.

brian-dupont commented 4 years ago

Same issue. Did not see any reference to BabiliWebpackPlugin, so I commented out the 2 references to MinifyPlugin in webpack.renderer.config.js and the build was successful

thanhbinh0995 commented 4 years ago

Change let whiteListedModules = ['vue', 'vuetify']; in webpack.render.config.js file

zxnShellin commented 4 years ago

in my case,it caused by the eslint rule in index.ejs file. i added the *.ejs in .eslintignore file and solved this problem

Borderliner commented 4 years ago

Adding vuetify to the white list didn't solve the issue. BabiliWebpackPlugin doesn't exist anymore. The only working solution I found was @brian-dupont 's, but I don't feel comfortable disabling the minifier. Is there a way we can use MinifyPlugin without disabling it?

misterpancn commented 4 years ago

babel-minify-webpack-plugin have been abandoned. npm install terser-webpack-plugin --save-dev change webpack.renderer.config.js

// delete const MinifyPlugin = require("babel-minify-webpack-plugin")
// use
const TerserPlugin = require('terser-webpack-plugin');

// add to rendererConfig
let rendererConfig = {
  ...
  devtool: '#cheap-module-eval-source-map',
  optimization: {
    minimize: true,
    minimizer: [new TerserPlugin({
      sourceMap: true,
    })],
  },
  ...
}
qiufeihong2018 commented 4 years ago

@biglmao good

qiufeihong2018 commented 4 years ago

@misterpancn Good,Thank you!

Enoooch commented 3 years ago

Using MinifyPlugin, the error still exists.

const MinifyPlugin = require("babel-minify-webpack-plugin")

Have to comment out this line.

electron version: 6.0.0