npm run dev和npm run build打包 问题

[zhang14725804]

1、各种版本

`
"iview": "^3.0.0",
"vue": "^2.5.16",
"vue-router": "^2.8.1"

"webpack": "^2.2.1",
"webpack-dev-server": "^2.4.1",
"webpack-merge": "^3.0.0"
`

2、base.config.js文件

`
const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
function resolve (dir) {
return path.join(__dirname, dir)
}
module.exports = {
entry: {
main: './src/main',
vendors: './src/vendors'
},
output: {
path: path.join(__dirname, './dist')
},
module: {
rules: [
{
test: /.vue$/,
use: [
{
loader: 'vue-loader',
options: {
loaders: {
less: ExtractTextPlugin.extract({
use: ['css-loader?minimize', 'autoprefixer-loader', 'less-loader'],
fallback: 'vue-style-loader'
}),
css: ExtractTextPlugin.extract({
use: ['css-loader', 'autoprefixer-loader', 'less-loader'],
fallback: 'vue-style-loader'
})
}
}
},
{
loader: 'iview-loader',
options: {
prefix: false
}
}
]
},
{
test: /iview/.?js$/,
loader: 'babel-loader'
},
{
test: /.js$/,
loader: 'babel-loader',
exclude: /node_modules/
},
{
test: /.css$/,
use: ExtractTextPlugin.extract({
use: ['css-loader?minimize', 'autoprefixer-loader'],
fallback: 'style-loader'
})
},
{
test: /.less/,
use: ExtractTextPlugin.extract({
use: ['css-loader?minimize', 'autoprefixer-loader', 'less-loader'],
fallback: 'style-loader'
})
},
{
test: /.(gif|jpg|png|woff|svg|eot|ttf)??.$/,
loader: 'url-loader?limit=1024'
},
{
test: /.(html|tpl)$/,
loader: 'html-loader'
}
]
},
resolve: {
extensions: ['.js', '.vue'],
alias: {
'vue': 'vue/dist/vue.esm.js',
'libs':resolve('src/libs'),
'images':resolve('src/images'),
'views':resolve('src/views'),
'components':resolve('src/components'),
}
}
};

`

3、prod.config.js

`
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const merge = require('webpack-merge');
const webpackBaseConfig = require('./webpack.base.config.js');
const fs = require('fs');

fs.open('./src/config/env.js', 'w', function (err, fd) {
const buf = 'export default "production";';
fs.write(fd, buf, 0, buf.length, 0, function (err, written, buffer){});
});

module.exports = merge(webpackBaseConfig, {
output: {
//publicPath: '/dist/',
publicPath: './dist/',
filename: '[name].[hash].js',
chunkFilename: '[name].[hash].chunk.js'
},
plugins: [
new ExtractTextPlugin({
filename: '[name].[hash].css',
allChunks: true
}),
new webpack.optimize.CommonsChunkPlugin({
name: 'vendors',
filename: 'vendors.[hash].js'
}),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"'
}
}),
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
}),
new HtmlWebpackPlugin({
filename: '../index_prod.html',
template: './src/template/index.ejs',
inject: false
})
]
});
`

问题：：
（1）npm run build之后字体文件找不到（多了一层dist），编译后woff路径为./dist/dist/*.woff
当前解决方案：编译之后手动修改main.css中的字体路径
（2）删除dist路径之后，npm run dev，各种js\css\woff文件找不到，

`

<title>iView project</title>

<script type="text/javascript" src="./dist/vendors.58265de691095c757b55.js"></script> <script type="text/javascript" src="./dist/main.58265de691095c757b55.js"></script> ` 之前的项目，index.html没引入编译后的文件，只是给一个根元素就好了