首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >webpack 2: UglifyJs中的./public/bundle.js中的错误

webpack 2: UglifyJs中的./public/bundle.js中的错误
EN

Stack Overflow用户
提问于 2016-08-21 12:58:10
回答 1查看 6.4K关注 0票数 9

我有两个相关的问题:

首先:当我运行npm run build时,bundle.js文件并没有缩小,但我确实得到了一个bundle.js.map文件。

第二:当我运行webpack -d时,我只得到一个小型化的bundle.js文件(没有错误),但是当我运行webpack -p时,我得到了一个bundle.js,即而不是bundle.js.map,以及这些错误:

代码语言:javascript
复制
ERROR in ./public/bundle.js from UglifyJs
Unexpected character '`' [./app/config.js:5,0][./public/bundle.js:76,14]

ERROR in ./public/bundle.js from UglifyJs
Unexpected character '`' [./app/config.js:5,0][./public/bundle.js:76,14]

我的问题是:

  1. 难道webpack -pwebpack -d的行为不应该相反吗?
  2. 为什么bundle.js在我运行npm run build时没有缩小
  3. 当我在模块中使用模板字符串时,为什么要获得这些Unexpected character错误?

package.json看起来是这样的:

代码语言:javascript
复制
{
  ...,
  "scripts": {
    "build": "webpack --progress --watch"
  },
  "devDependencies": {
    "babel-core": "^6.13.2",
    "babel-loader": "^6.2.5",
    "babel-preset-es2015-native-modules": "^6.9.4",
    "eslint": "^3.3.1",
    "eslint-config-airbnb": "^10.0.1",
    "eslint-plugin-html": "^1.5.2",
    "eslint-plugin-import": "^1.13.0",
    "eslint-plugin-jsx-a11y": "^2.1.0",
    "eslint-plugin-react": "^6.1.2",
    "webpack": "^2.1.0-beta.21"
  }
}

webpack.config.js是这样的:

代码语言:javascript
复制
const webpack = require('webpack'); // eslint-disable-line import/no-extraneous-dependencies

const nodeEnv = process.env.NODE_ENV || 'production';

module.exports = {
  entry: {
    filename: './app/app.js'
  },
  output: {
    filename: './public/bundle.js'
  },
  modules: {
    loaders: [
      {
        test: /\.js?$/,
        exclude: /node_modules/,
        loader: 'babel',
        query: {
          presets: ['es2015-native-modules']
        }
      }
    ]
  },
  devtool: 'source-map',
  plugins: [
    // uglify
    new webpack.optimize.UglifyJsPlugin({
      compress: { warnings: false },
      output: { comments: false },
      sourceMap: true
    }),
    new webpack.DefinePlugin({
      'process.env': { NODE_ENV: JSON.stringify(nodeEnv) }
    })
  ]
};

我确实搜索了这里和谷歌( webpack博士…)但我找不到对我有用的东西。谢谢!!

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-11-26 12:00:51

UglifyJS2的版本中还没有ES6/和谐支持。但是,有一个和谐分支,它允许您使用ES6语法缩小/丑化文件。

我可以向您建议另一种解决方案,它可以帮助您花费更少的构建时间将所有ES6转换为ES5。

只需在package.json中指定UglifyJs,然后让npm处理依赖项。"uglify-js": "git://github.com/mishoo/UglifyJS2#harmony-v2.8.22",

票数 6
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/39064441

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档