这是我的配置
var webpack = require('webpack');
var webpackDevServer = require('webpack-dev-server');
var wecpackConfig = module.exports = {};// init object
// input
wecpackConfig.entry = {
app:[
'./app.js',
'./bower_components/ratchet/dist/css/ratchet.css',
'./bower_components/font-awesome/css/font-awesome.css'
],
};
wecpackConfig.output = {
path:'./dist',
filename: '[name].js'
};// output
//doc loader
wecpackConfig.module = {
loaders : [
{
test: /\.css$/,
loader: 'style!css'
},
{
test: /\.vue$/,
loader: 'vue'
},
{ test: /\.js$/,
loader: 'babel'
},
{
test: /\.(eot(|\?v=4.5.0)|woff(|\?v=4.5.0)|woff2(|\?v=4.5.0)|ttf(|\?v=4.5.0)|svg(|\?v=4.5.0))$/,
loader: 'file'
},
]
};
wecpackConfig.plugins = [new webpack.HotModuleReplacementPlugin()];
wecpackConfig.entry.app.unshift("webpack-dev-server/client?http://localhost:9999", "webpack/hot/dev-server");
var compiler = webpack(wecpackConfig);
var server = new webpackDevServer(compiler, {
hot: true
});
server.listen(9999);
这是报错的信息
/home/tigerb/github/easy-vue/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/middleware.js:105
if(err) throw err;
^
Error: invalid argument
at pathToArray (/home/tigerb/github/easy-vue/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/node_modules/memory-fs/lib/MemoryFileSystem.js:44:10)
at MemoryFileSystem.mkdirpSync (/home/tigerb/github/easy-vue/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/node_modules/memory-fs/lib/MemoryFileSystem.js:139:13)
at MemoryFileSystem.(anonymous function) [as mkdirp] (/home/tigerb/github/easy-vue/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/node_modules/memory-fs/lib/MemoryFileSystem.js:279:34)
at Compiler.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compiler.js:229:25)
at Compiler.applyPluginsAsync (/home/tigerb/github/easy-vue/node_modules/webpack/node_modules/tapable/lib/Tapable.js:60:69)
at Compiler.emitAssets (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compiler.js:226:7)
at Watching.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compiler.js:54:18)
at /home/tigerb/github/easy-vue/node_modules/webpack/lib/Compiler.js:403:12
at Compiler.next (/home/tigerb/github/easy-vue/node_modules/webpack/node_modules/tapable/lib/Tapable.js:67:11)
at Compiler.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/CachePlugin.js:40:4)
at Compiler.applyPluginsAsync (/home/tigerb/github/easy-vue/node_modules/webpack/node_modules/tapable/lib/Tapable.js:71:13)
at Compiler.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compiler.js:400:9)
at Compilation.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compilation.js:577:13)
at Compilation.applyPluginsAsync (/home/tigerb/github/easy-vue/node_modules/webpack/node_modules/tapable/lib/Tapable.js:60:69)
at Compilation.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compilation.js:572:10)
at Compilation.applyPluginsAsync (/home/tigerb/github/easy-vue/node_modules/webpack/node_modules/tapable/lib/Tapable.js:60:69)
at Compilation.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compilation.js:567:9)
at Compilation.applyPluginsAsync (/home/tigerb/github/easy-vue/node_modules/webpack/node_modules/tapable/lib/Tapable.js:60:69)
at Compilation.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compilation.js:563:8)
at Compilation.applyPluginsAsync (/home/tigerb/github/easy-vue/node_modules/webpack/node_modules/tapable/lib/Tapable.js:60:69)
at Compilation.seal (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compilation.js:525:7)
at Compiler.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compiler.js:397:15)
at /home/tigerb/github/easy-vue/node_modules/webpack/node_modules/tapable/lib/Tapable.js:103:11
at Compilation.<anonymous> (/home/tigerb/github/easy-vue/node_modules/webpack/lib/Compilation.js:445:10)
at /home/tigerb/github/easy-vue/node_modules/webpack/lib/Compilation.js:417:12
at /home/tigerb/github/easy-vue/node_modules/webpack/lib/Compilation.js:332:10
at /home/tigerb/github/easy-vue/node_modules/webpack/node_modules/async/lib/async.js:52:16
at done (/home/tigerb/github/easy-vue/node_modules/webpack/node_modules/async/lib/async.js:246:17)
at /home/tigerb/github/easy-vue/node_modules/webpack/node_modules/async/lib/async.js:44:16
at /home/tigerb/github/easy-vue/node_modules/webpack/lib/Compilation.js:332:10
你应该设置 output.path 是一个绝对路径
output: {
path: __dirname + '/assets/',
publicPath: './assets/',
filename: 'bundle.js'
},// webpack.confib.js
var webpack = require("webpack");
var vue = require("vue-loader");
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var HtmlWebpackPlugin = require('html-webpack-plugin');
var publicPath = "/static/";
var plugins = [
new ExtractTextPlugin("style.css"),
new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js')
];
if(process.env.NODE_ENV === 'clean-build'){
plugins[2] =
new HtmlWebpackPlugin({
filename: '../index.html',
template: './static/template/index.html'
});
}
var config = {
entry: {
app:['./src/main.coffee'],
vendors: ['vue','jquery','vuex','vue-router']
},
output: {
path: __dirname + publicPath,
filename: 'app.js',
publicPath: publicPath,
},
module: {
loaders: [
{
test: /\.vue$/,
loader: 'vue'
},
{
test: /\.coffee$/,
exclude: /node_modules|vue\/dist|vue-router\/|vue-loader\/|vue-hot-reload-api\//,
loader: 'coffee'
},
{
test: /\.less$/,
loader: ExtractTextPlugin.extract(
"style", "css!less")
},
{
test: /\.css$/,
loader: ExtractTextPlugin.extract(
"style-loader", "css-loader?sourceMap!cssnext-loader")
},
]
},
vue: {
loaders: {
css: ExtractTextPlugin.extract("css"),
less: ExtractTextPlugin.extract("css!less-loader")
}
},
resolve: {
extensions: ['', '.coffee', '.js'],
},
plugins: plugins,
devtool: "source-map",
};
module.exports = config;app.coffee
webpack = require 'webpack'
WebpackDevServer = require 'webpack-dev-server'
config = require './webpack.config'
config.entry.app.unshift "webpack-dev-server/client?http://localhost:9090", "webpack/hot/dev-server"
config.plugins.push new webpack.HotModuleReplacementPlugin()
proxy = {}
app = new WebpackDevServer(webpack(config), {
publicPath: config.output.publicPath,
historyApiFallback: true,
hot: true,
});
app.listen(9090);
output 上增加 publicPath
output.path配置的不对，要配置绝对路径，如下：
output: {
path: __dirname + '/assets/',
publicPath: './assets/',
filename: 'bundle.js'
}