jantimon / html-webpack-plugin

Simplifies creation of HTML files to serve your webpack bundles
MIT License
10.71k stars 1.31k forks source link

Unexpected token #910

Closed mishkeTI closed 6 years ago

mishkeTI commented 6 years ago

Description

I am trying to make this work and eventually integrate it in cordova project.

package.json

{
  "name": "f7-cnode",
  "version": "2.2.0",
  "description": "A starter project for using Framework7 with Webpack2.0 via Babel!",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "webpack-dev-server --config build/webpack.config.js -d --colors --inline",
    "build": "cross-env NODE_ENV=production webpack --config build/webpack.config.js --progress --hide-modules"
  },
  "author": "Hejx",
  "license": "MIT",
  "devDependencies": {
    "@types/jquery": "^3.3.1",
    "autoprefixer": "^8.2.0",
    "babel-core": "^6.22.1",
    "babel-loader": "^7.1.4",
    "babel-preset-es2015": "^6.22.0",
    "babel-preset-stage-2": "^6.22.0",
    "copy-webpack-plugin": "^4.0.1",
    "cross-env": "^5.1.4",
    "css-loader": "^0.28.11",
    "extract-text-webpack-plugin": "^3.0.2",
    "file-loader": "^1.1.11",
    "framework7": "^2.1.3",
    "graceful-fs": "^4.1.11",
    "html-loader": "^0.5.5",
    "html-webpack-plugin": "^2.30.1",
    "json-loader": "^0.5.4",
    "less": "^3.0.1",
    "less-loader": "^4.1.0",
    "postcss-loader": "^2.1.3",
    "style-loader": "^0.20.3",
    "url-loader": "^1.0.1",
    "webpack": "^3.10.0",
    "webpack-cli": "^2.0.13",
    "webpack-dev-server": "^2.11.2",
    "webpack-dev-server-proxy": "0.0.8",
    "wepack": "0.0.1"
  },
  "dependencies": {
    "date-fns": "^1.28.0",
    "node-polyglot": "^2.2.2"
  }
}

Error Message & Stack Trace

$ npm run build

> f7-cnode@2.2.0 build C:\wamp64\www\Cordova\Cordova-ts\1
> cross-env NODE_ENV=production webpack --config build/webpack.config.js --progress --hide-modules

Hash: 1d1c955b41be833494eb
Version: webpack 3.10.0
Time: 5111ms
 5 assets

ERROR in app.js from UglifyJs
Unexpected token: name (Dom7) [app.js:749,6]
Child html-webpack-plugin for "index.html":
     1 asset
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js!src/assets/css/icons.css:
     2 assets
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js!node_modules/less-loader/dist/cjs.js!node_modules/postcss-loader/lib/index.js!src/assets/app.less:
     1 asset
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! f7-cnode@2.2.0 build: `cross-env NODE_ENV=production webpack --config build/webpack.config.js --progress --hide-modules`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the f7-cnode@2.2.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\ThinkIT\AppData\Roaming\npm-cache\_logs\2018-03-27T14_01_29_589Z-debug.log

Log

0 info it worked if it ends with ok
1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe',
1 verbose cli   'C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli   'run',
1 verbose cli   'build' ]
2 info using npm@5.6.0
3 info using node@v9.8.0
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle f7-cnode@2.2.0~prebuild: f7-cnode@2.2.0
6 info lifecycle f7-cnode@2.2.0~build: f7-cnode@2.2.0
7 verbose lifecycle f7-cnode@2.2.0~build: unsafe-perm in lifecycle true
8 verbose lifecycle f7-cnode@2.2.0~build: PATH: C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\wamp64\www\Cordova\Cordova-ts\1\node_modules\.bin;C:\Users\ThinkIT\bin;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\local\bin;C:\Program Files\Git\usr\bin;C:\Program Files\Git\usr\bin;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\bin;C:\Users\ThinkIT\bin;C:\ProgramData\Oracle\Java\javapath;C:\Program Files (x86)\Intel\iCLS Client;C:\Program Files\Intel\iCLS Client;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\PuTTY;C:\Program Files\nodejs;C:\Program Files\Git\cmd;C:\Program Files\Java\jdk1.8.0_161\bin;C:\Users\ThinkIT\AppData\Local\Android\Sdk\platform-tools;C:\Python27;C:\Program Files (x86)\Windows Kits\8.1\Windows Performance Toolkit;C:\Users\ThinkIT\AppData\Local\Microsoft\WindowsApps;C:\Users\ThinkIT\AppData\Roaming\npm;C:\Program Files\Git\usr\bin\vendor_perl;C:\Program Files\Git\usr\bin\core_perl
9 verbose lifecycle f7-cnode@2.2.0~build: CWD: C:\wamp64\www\Cordova\Cordova-ts\1
10 silly lifecycle f7-cnode@2.2.0~build: Args: [ '/d /s /c',
10 silly lifecycle   'cross-env NODE_ENV=production webpack --config build/webpack.config.js --progress --hide-modules' ]
11 silly lifecycle f7-cnode@2.2.0~build: Returned: code: 2  signal: null
12 info lifecycle f7-cnode@2.2.0~build: Failed to exec build script
13 verbose stack Error: f7-cnode@2.2.0 build: `cross-env NODE_ENV=production webpack --config build/webpack.config.js --progress --hide-modules`
13 verbose stack Exit status 2
13 verbose stack     at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\index.js:285:16)
13 verbose stack     at EventEmitter.emit (events.js:180:13)
13 verbose stack     at ChildProcess.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:180:13)
13 verbose stack     at maybeClose (internal/child_process.js:936:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:220:5)
14 verbose pkgid f7-cnode@2.2.0
15 verbose cwd C:\wamp64\www\Cordova\Cordova-ts\1
16 verbose Windows_NT 10.0.16299
17 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "build"
18 verbose node v9.8.0
19 verbose npm  v5.6.0
20 error code ELIFECYCLE
21 error errno 2
22 error f7-cnode@2.2.0 build: `cross-env NODE_ENV=production webpack --config build/webpack.config.js --progress --hide-modules`
22 error Exit status 2
23 error Failed at the f7-cnode@2.2.0 build script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 2, true ]

Config

Copy the relevant section from webpack.config.js:

config.js

module.exports = {
  dev: {
    host: 'localhost',
    port: 8080,
    proxy: {
      "/api": "http://localhost:3000"
    }
  }
}

rules.js

const ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = [
  {
    test: /\.css$/,
    use: ExtractTextPlugin.extract({
      fallback: 'style-loader',
      use: 'css-loader'
    })
  },
  {
    test: /\.less$/,
    use: ExtractTextPlugin.extract({
      fallback: 'style-loader',
      use: ["css-loader", "less-loader", "postcss-loader"]
    })
  },
  {
    test: /\.js$/,
    use: 'babel-loader',
    exclude: /node_modules/
  },
  {
    test: /\.html$/,
    use: 'html-loader'
  },
  {
    test: /\.png$/,
    use: 'url-loader?limit=8192&mimetype=image/png'
  },
  {
    test: /\.jpe?g$/,
    use: 'ur-loaderl?limit=8192&mimetype=image/jpg'
  },
  {
    test: /\.gif$/,
    use: 'url-loader?limit=8192&mimetype=image/gif'
  },
  {
    test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
    use: 'url-loader?limit=8192&mimetype=image/svg+xml'
  },
  { test: /\.(png|woff|woff2|eot|ttf|svg)$/, use: 'url-loader?limit=100000' },
  {
    test: /\.otf(\?v=\d+\.\d+\.\d+)?$/,
    use: 'file-loader'
  },
  {
    test: /\.json$/,
    use: 'json-loader'
  }
];
const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');

const rules = require('./rules');
const config = require('./config');

const webpackConfig = {
  entry: {
      app: ['./src/app/index.js']
  },
  output: {
    path: path.resolve(__dirname, '../dist/'),
    filename: 'app.js',
    publicPath: '/'
  },
  module: {
    rules
  },
  devServer: config.dev,
  plugins: [
    new ExtractTextPlugin({
      filename: 'style.css',
      disable: false,
      allChunks: true
    }),
    new CopyWebpackPlugin([
      {from: './src/page', to: './page' }
    ]),
    new HtmlWebpackPlugin({
      filename: 'index.html',
      template: 'index.html',
      hash: process.env.NODE_ENV === 'production'
    }),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoEmitOnErrorsPlugin()
  ]
};

if (process.env.NODE_ENV === 'production') {
  webpackConfig.plugins = webpackConfig.plugins.concat([
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('production')
    }),
    new webpack.optimize.UglifyJsPlugin({
      compress: {
        warnings: false
      }
    }),
    new webpack.optimize.ModuleConcatenationPlugin()
  ]);
}

module.exports = webpackConfig;

Relevant Links

This is the example I was using (and I edited it) https://github.com/hejianxian/framework7-webpack-demo

Environment

Win 10 Node 9.8.0 npm 5.6 html-webpack-plugin 2.30.1

jantimon commented 6 years ago

The html-webpack-plugin uses the same loader configuration like the usual webpack configuration.
Please see also the FAQ and stackoverflow.

lock[bot] commented 6 years ago

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.