实战

回到首页 个人中心 反馈问题 注册登录
下载APP
首页 课程 实战 体系课 手记 专栏 慕课教程

npm run dist_win不能启动，总报错，麻烦您看下

来源：3-8 webpack-dev-server

慕粉0202513651

2019-10-07

老师，win10系统，npm run dev_win能启动起来，但是npm run dist_win不能启动，总报错，麻烦您看下。

XXX@DESKTOP MINGW64 ~/Desktop/mall/doc/mall-fe (mall_V1.0)
$ npm  run  dist_win

> mall-fe@1.0.0 dist_win C:\Users\XXX\Desktop\mall\doc\mall-fe
> set WEBPACK_ENV=online && webpack -p

dev
Hash: 6cf2fc85f863616b120a
Version: webpack 1.15.0
Time: 3513ms
          Asset       Size  Chunks             Chunk Names
view/index.html    3.34 kB          [emitted]
     js/base.js    79.7 kB       0  [emitted]  common
    js/index.js  120 bytes       1  [emitted]  index
    js/login.js  121 bytes       2  [emitted]  login
  css/index.css   46 bytes       1  [emitted]  index
view/login.html  397 bytes          [emitted]
   [0] multi common 40 bytes {0} [built]
   [0] multi index 28 bytes {1} [built]
   [0] multi login 28 bytes {2} [built]
  [34] ./src/page/module.js 193 bytes {0} [built]
  [77] ./src/page/common/index.js 181 bytes {0} [built]
  [78] ./src/page/index/index.js 207 bytes {1} [built]
  [79] ./src/page/login/index.js 208 bytes {2} [built]
    + 79 hidden modules

WARNING in js/base.js from UglifyJs
Condition left of && always true [./~/json3/lib/json3.js:5,0]
Dropping unused function encode [./~/querystringify/index.js:28,0]
Condition always true [./~/url/~/punycode/punycode.js:511,0]
Dropping unreachable code [./~/url/~/punycode/punycode.js:518,2]
Side effects in initialization of unused variable freeExports [./~/url/~/punycode/punycode.js:5,0]
Side effects in initialization of unused variable freeModule [./~/url/~/punycode/punycode.js:7,0]
Dropping unused variable key [./~/url/~/punycode/punycode.js:56,0]
Condition always true [(webpack)-dev-server/client?http:/localhost:8088/:20,0]
Dropping unreachable code [(webpack)-dev-server/client?http:/localhost:8088/:23,1]
Declarations in unreachable code! [(webpack)-dev-server/client?http:/localhost:8088/:25,0]
Dropping unused function getCurrentScriptSource [(webpack)-dev-server/client?http:/localhost:8088/:5,0]
Dropping unused variable scriptHost [(webpack)-dev-server/client?http:/localhost:8088/:25,0]

ERROR in   Error: Child compilation failed:
  Module build failed: Error: Parse Error: <<head>
      <meta charset="utf-8">
  </head>

  - htmlparser.js:240 new HTMLParser
    [mall-fe]/[html-minifier]/src/htmlparser.js:240:13

  - htmlminifier.js:966 minify
    [mall-fe]/[html-minifier]/src/htmlminifier.js:966:3

  - htmlminifier.js:1326 Object.exports.minify
    [mall-fe]/[html-minifier]/src/htmlminifier.js:1326:16


  - Error: Parse Error: <<head>

  - <meta charset="utf-8">

  - </head>

  - compiler.js:79 childCompiler.runAsChild
    [mall-fe]/[html-webpack-plugin]/lib/compiler.js:79:16

  - Compiler.js:214 Compiler.<anonymous>
    [mall-fe]/[webpack]/lib/Compiler.js:214:10

  - Compiler.js:403
    [mall-fe]/[webpack]/lib/Compiler.js:403:12

  - Tapable.js:67 Compiler.next
    [mall-fe]/[tapable]/lib/Tapable.js:67:11

  - CachePlugin.js:40 Compiler.<anonymous>
    [mall-fe]/[webpack]/lib/CachePlugin.js:40:4

  - Tapable.js:71 Compiler.applyPluginsAsync
    [mall-fe]/[tapable]/lib/Tapable.js:71:13

  - Compiler.js:400 Compiler.<anonymous>
    [mall-fe]/[webpack]/lib/Compiler.js:400:9

  - Compilation.js:577 Compilation.<anonymous>
    [mall-fe]/[webpack]/lib/Compilation.js:577:13

  - Tapable.js:60 Compilation.applyPluginsAsync
    [mall-fe]/[tapable]/lib/Tapable.js:60:69

  - Compilation.js:572 Compilation.<anonymous>
    [mall-fe]/[webpack]/lib/Compilation.js:572:10

  - Tapable.js:67 Compilation.next
    [mall-fe]/[tapable]/lib/Tapable.js:67:11

  - UglifyJsPlugin.js:140 Compilation.<anonymous>
    [mall-fe]/[webpack]/lib/optimize/UglifyJsPlugin.js:140:4

  - Tapable.js:71 Compilation.applyPluginsAsync
    [mall-fe]/[tapable]/lib/Tapable.js:71:13

  - Compilation.js:567 Compilation.<anonymous>
    [mall-fe]/[webpack]/lib/Compilation.js:567:9

  - Tapable.js:60 Compilation.applyPluginsAsync
    [mall-fe]/[tapable]/lib/Tapable.js:60:69

  - Compilation.js:563 Compilation.<anonymous>
    [mall-fe]/[webpack]/lib/Compilation.js:563:8

  - Tapable.js:60 Compilation.applyPluginsAsync
    [mall-fe]/[tapable]/lib/Tapable.js:60:69

  - Compilation.js:525 Compilation.seal
    [mall-fe]/[webpack]/lib/Compilation.js:525:7

  - Compiler.js:397 Compiler.<anonymous>
    [mall-fe]/[webpack]/lib/Compiler.js:397:15

  - Tapable.js:103
    [mall-fe]/[tapable]/lib/Tapable.js:103:11

  - Compilation.js:445 Compilation.<anonymous>
    [mall-fe]/[webpack]/lib/Compilation.js:445:10

  - Compilation.js:417
    [mall-fe]/[webpack]/lib/Compilation.js:417:12

  - Compilation.js:332
    [mall-fe]/[webpack]/lib/Compilation.js:332:10

  - async.js:52
    [mall-fe]/[async]/lib/async.js:52:16

  - async.js:246 done
    [mall-fe]/[async]/lib/async.js:246:17

  - async.js:44
    [mall-fe]/[async]/lib/async.js:44:16

  - Compilation.js:332
    [mall-fe]/[webpack]/lib/Compilation.js:332:10

  - async.js:52
    [mall-fe]/[async]/lib/async.js:52:16

  - async.js:246 done
    [mall-fe]/[async]/lib/async.js:246:17

  - async.js:44
    [mall-fe]/[async]/lib/async.js:44:16


Child html-webpack-plugin for "view\index.html":
        + 4 hidden modules

    ERROR in ./~/html-loader!./src/view/layout/html-head.html
    Module build failed: Error: Parse Error: <<head>
        <meta charset="utf-8">
    </head>
        at new HTMLParser (C:\Users\XXX\Desktop\mall\doc\mall-fe\node_modules\html-minifier\src\htmlparser.js:240:13)
        at minify (C:\Users\XXX\Desktop\mall\doc\mall-fe\node_modules\html-minifier\src\htmlminifier.js:966:3)
        at Object.exports.minify (C:\Users\XXX\Desktop\mall\doc\mall-fe\node_modules\html-minifier\src\htmlminifier.js:1326:16)
        at Object.module.exports (C:\Users\XXX\Desktop\mall\doc\mall-fe\node_modules\html-loader\index.js:128:26)
     @ ./~/html-webpack-plugin/lib/loader.js!./src/view/index.html 4:10-56
Child html-webpack-plugin for "view\login.html":
        + 3 hidden modules
Child extract-text-webpack-plugin:
        + 2 hidden modules

webpack.config.js文件

/*
* @Author: XXX
* @Date:   2019-10-05 19:32:57
* @Last Modified by:   XXX
* @Last Modified time: 2019-10-07 02:02:43
*/
var webpack              = require('webpack');
var ExtractTextPlugin    = require("extract-text-webpack-plugin");
var HtmlWebpackPugPlugin = require('html-webpack-plugin');

//环境变量的配置，dev/ online
var WEBPACK_ENV          = process.env.WEBPACK_NEW || 'dev';
console.log(WEBPACK_ENV);

//获取html-webpack-plugin参数的方法
var getHtmlConfig = function(name){
    return {
        template  : './src/view/'+name+'.html',
        filename  : 'view/'+name+'.html',
        inject    : true,
        hash      : true,
        chunks    : ['common',name]
    };
};

//webapck config
var config = {
  //入口
    entry: {
        'common' : ['./src/page/common/index.js'],
        'index'  : ['./src/page/index/index.js'],
        'login'  : ['./src/page/login/index.js']
    },
    //输出口
    output: {
        path       : './dist',
        publicPath : '/dist',
        filename   : 'js/[name].js'
    },
    //模块化加载
    externals :{
        'jquery' : 'window.jQuery'
    },
    //各种插件
    module:{
        loaders:  [
            {test :/\.css$/, loader: ExtractTextPlugin.extract("style-loader","css-loader")},
            //{test :/\.(gif|png|jpg)\??.*$/, loader:'url-loader'}
            {test :/\.(gif|png|jpg|woff|svg|eot|ttf)\??.*$/, loader: 'url-loader?limit=100&name=resource/[name].[ext]'}
        ]
    },
    //公共模块的加载
    plugins:[
        //独立通用模块到js/base.js
        new webpack.optimize.CommonsChunkPlugin({
            name     :'common',
            filename :'js/base.js'
        }),
        //把css单独打包到文件里
        new ExtractTextPlugin("css/[name].css"),
        //HTML模板的处理
        new HtmlWebpackPugPlugin(getHtmlConfig('index')),
        new HtmlWebpackPugPlugin(getHtmlConfig('login')),
    ]
    
};

if('dev' === WEBPACK_ENV){
    config.entry.common.push('webpack-dev-server/client?http://localhost:8088/');
}

module.exports = config;

package.json文件

{
  "name": "mall-fe",
  "version": "1.0.0",
  "description": "mall前端代码",
  "main": "index.js",
  "scripts": {
    "dev_win"  : "set WEBPACK_ENV=dev    && webpack-dev-server --linne --port 8088",
    "dist_win" : "set WEBPACK_ENV=online && webpack -p" 
  },
  "repository": {
    "type": "git",
    "url": "git@gitee.com:private-mall/mall-fe.git"
  },
  "author": "XXX",
  "license": "ISC",
  "devDependencies": {
    "css-loader": "^0.28.1",
    "extract-text-webpack-plugin": "^1.0.1",
    "file-loader": "^0.11.1",
    "html-loader": "^0.5.5",
    "html-webpack-plugin": "^3.2.0",
    "style-loader": "^0.17.0",
    "url-loader": "^0.5.8",
    "webpack": "^1.15.0",
    "webpack-dev-server": "^1.16.5"
  }
}
写回答

2回答

妖艳哈士奇丶

2019-10-07

已采纳

webpack.config.js错了

//环境变量的配置，dev/ online
var WEBPACK_ENV          = process.env.WEBPACK_NEW || 'dev';

改成

var WEBPACK_ENV = process.env.WEBPACK_ENV || 'dev';

这位同学你太粗心大意了，居然把 ENV 打成了 NEW

2
3
慕粉0202513651
问题已经解决了 ，主要是提取的通用模块里边有问题，所以打包出错了 ，非常感谢，谢谢。
2019-10-07
共3条回复

妖艳哈士奇丶

2019-10-07

另外看了你的报错

ERROR in   Error: Child compilation failed:
  Module build failed: Error: Parse Error: <<head>
      <meta charset="utf-8">
  </head>

<head>标签前多了一个 “<”,正确的应该是 

<head>
      <meta charset="utf-8">
  </head>


2
1
慕粉0202513651
哎，不得不说你真的很认真，谢谢你的帮助，老天不会亏待一个努力的人，加油＾０＾~
2019-10-07
共1条回复

真实数据对接 从0开发前后端分离的企业级上线项目

【毕设项目精品】前端实战，对接真实服务端数据，开发完整项目

4262 学习 · 4113 问题

查看课程

相似问题

npm run dist_win

回答 1

npm run dist

回答 1

npm run dev后出现了这种情况

回答 3

执行 npm run dev时，出现以下错误

回答 2

无法登录成功且sockjs-node/info？接口一直报错502

回答 2

打开慕课网App查看更多内容