2
我试图建立'的WebPack 2和巴贝尔预设-ENV工作。巴贝尔预设-ENV不是的WebPack-DEV-服务器V2.2.0-rc.0
我有以下基础配置:
const config = require('./config');
const path = require('path');
module.exports = {
devtool: 'source-map',
performance: {
hints: false
},
entry: [
'./src/index.js',
],
output: {
path: path.join(__dirname, '../dist'),
publicPath: '/dist/',
filename: 'app.js'
},
plugins: [],
module: {
loaders: [
{
test: /\.js$/,
loader: 'babel-loader',
exclude: ['/node_modules/'],
query: {
'presets': [['env', {
"modules": false,
"targets": {
"browsers": ["last 2 versions", "safari >= 7"]
}
}]],
'plugins': [],
},
},
//...
],
},
}
而下面PROD配置:
const base = require('./webpack.base');
const webpack = require('webpack');
base.plugins.push(
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: true,
},
})
);
module.exports = base;
而下面的开发配置:
const base = require('./webpack.base');
const webpack = require('webpack');
base.entry.push(
'webpack/hot/dev-server',
'webpack-dev-server/client?http://localhost:4000'
);
base.plugins.push(
new webpack.HotModuleReplacementPlugin()
);
module.exports = base;
最后这里是我的dev服务器配置:
const dev = require('./webpack.dev');
const webpack = require('webpack');
const server = require('webpack-dev-server');
const path = require('path');
const compiler = webpack(dev);
const instance = new server(compiler, {
hot: true,
filename: dev.output.filename,
publicPath: dev.output.publicPath,
stats: {
colors: true,
}
});
instance.listen(4000, 'localhost',() => {})
我已经尝试添加inline: false
并将contentBase
设置为根据此post我的应用的绝对路径,都没有运气。
现在,当我与督促配置运行一切编译罚款,但是当我与dev的配置我碰到下面的错误运行:
ERROR in ./~/debug/browser.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "/home/otis/Developer/hassle/node_modules/debug"
at /home/otis/Developer/hassle/node_modules/babel-core/lib/transformation/file/options/option-manager.js:299:19
at Array.map (native)
at OptionManager.resolvePresets (/home/otis/Developer/hassle/node_modules/babel-core/lib/transformation/file/options/option-manager.js:270:20)
at OptionManager.mergePresets (/home/otis/Developer/hassle/node_modules/babel-core/lib/transformation/file/options/option-manager.js:259:10)
at OptionManager.mergeOptions (/home/otis/Developer/hassle/node_modules/babel-core/lib/transformation/file/options/option-manager.js:244:14)
at OptionManager.init (/home/otis/Developer/hassle/node_modules/babel-core/lib/transformation/file/options/option-manager.js:374:12)
at File.initOptions (/home/otis/Developer/hassle/node_modules/babel-core/lib/transformation/file/index.js:216:65)
at new File (/home/otis/Developer/hassle/node_modules/babel-core/lib/transformation/file/index.js:139:24)
at Pipeline.transform (/home/otis/Developer/hassle/node_modules/babel-core/lib/transformation/pipeline.js:46:16)
at transpile (/home/otis/Developer/hassle/node_modules/babel-loader/lib/index.js:38:20)
@ ./~/sockjs-client/lib/main.js 25:10-26
@ ./~/sockjs-client/lib/entry.js
@ (webpack)-dev-server/client/socket.js
@ (webpack)-dev-server/client?http://localhost:4000
@ multi main
这里是我的package.json的副本,如果有帮助:
{
"name": "hassle",
"version": "0.0.0",
"description": "Hassle an event organisation app",
"main": "index.js",
"scripts": {
"dev": "NODE_ENV=development node build/server.js",
"build": "NODE_ENV=production webpack --config build/webpack.prod.js",
"test": "echo 'lets implement'"
},
"repository": {
"type": "git",
"url": "git+https://github.com/Shipwrecked/Hassle.git"
},
"author": "Otis Wright",
"license": "MIT",
"bugs": {
"url": "https://github.com/Shipwrecked/Hassle/issues"
},
"homepage": "https://github.com/Shipwrecked/Hassle#readme",
"dependencies": {},
"devDependencies": {
"babel-core": "^6.2",
"babel-loader": "^6.2",
"babel-preset-env": "^1.0",
"css-loader": "^0.26",
"file-loader": "^0.9",
"node-sass": "^4.0",
"rimraf": "^2.5",
"sass-loader": "^4.1",
"style-loader": "^0.13",
"webpack": "^2.2.0-rc.1",
"webpack-dev-server": "^2.2.0-rc.0"
}
}
你有'babelrc'吗? – CodingIntrigue
不,但从我的理解我的webpack'babel-loader'的查询部分是处理设置我的'预设'它值得注意的是,这是所有工作之前,从'webpack-dev-server v2.1.0- beta.10“,没有'.babelrc'。 我不打扰更新如果它不是候选版本,但看到他们不应该从现在开始引入重大变化,这似乎是一个升级的好时机。 –