- Debug / development mode is fine, but an error occurs after packaging
- webpack.conf.js
var path = require("path");
var webpack = require("webpack");
module.exports = {
entry: "./src/main.js",
output: {
path: path.resolve(__dirname, "./dist"),
publicPath: "/dist/",
filename: "build.js"
},
module: {
rules: [
{
test: /\.css$/,
use: [
"vue-style-loader",
"css-loader"
],
},
{
test: /\.scss$/,
use: [
"vue-style-loader",
"css-loader",
"sass-loader"
],
},
{
test: /\.sass$/,
use: [
"vue-style-loader",
"css-loader",
"sass-loader?indentedSyntax"
],
},
{
test: /\.vue$/,
loader: "vue-loader",
options: {
loaders: {
// Since sass-loader (weirdly) has SCSS as its default parse mode, we map
// the "scss" and "sass" values for the lang attribute to the right configs here.
// other preprocessors should work out of the box, no loader config like this necessary.
"scss": [
"vue-style-loader",
"css-loader",
"sass-loader"
],
"sass": [
"vue-style-loader",
"css-loader",
"sass-loader?indentedSyntax"
]
}
// other vue-loader options go here
}
},
{
test: /\.js$/,
loader: "babel-loader",
exclude: /node_modules/
},
{
test: /\.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,
loader: "file-loader"
},
{
test: /\.(png|jpg|gif|svg)$/,
loader: "file-loader",
options: {
name: "[name].[ext]?[hash]"
}
}
]
},
resolve: {
alias: {
"vue$": "vue/dist/vue.esm.js"
},
extensions: ["*", ".js", ".vue", ".json"]
},
devServer: {
historyApiFallback: true,
noInfo: true,
overlay: true
},
performance: {
hints: false
},
devtool: "-sharpeval-source-map"
}
if (process.env.NODE_ENV === "production") {
module.exports.devtool = "-sharpsource-map"
// http://vue-loader.vuejs.org/en/workflow/production.html
module.exports.plugins = (module.exports.plugins || []).concat([
new webpack.DefinePlugin({
"process.env": {
NODE_ENV: ""production""
}
}),
new webpack.optimize.UglifyJsPlugin({
sourceMap: true,
compress: {
warnings: false
}
}),
new webpack.LoaderOptionsPlugin({
minimize: true
})
])
}
Please let the known friends tell you the reason, Thanks please () tell