- 34
- 0
项目vue: 2.5.0 webpack: 3.6.0
打包配置
webpack.base.conf.js
'use strict';
const path = require('path');
const utils = require('./utils');
const vueLoaderConfig = require('./vue-loader.conf');
function resolve (dir) {
return path.join(__dirname, '..', dir)
}
module.exports = {
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
}
},
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: vueLoaderConfig
},
{
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test')]
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('img/[name].[hash:7].[ext]')
}
},
{
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('media/[name].[hash:7].[ext]')
}
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}
]
}
};
webpack.prod.conf.js
'use strict';
const path = require('path');
const utils = require('./utils');
const webpack = require('webpack');
const config = require('../config');
const merge = require('webpack-merge');
const baseWebpackConfig = require('./webpack.base.conf');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin');
const env = config.build.env;
const webpackConfig = merge(baseWebpackConfig, {
entry: {
app: './src/main.js'
},
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('[name].js'),
publicPath: config.build.assetsPublicPath
},
module: {
rules: utils.styleLoaders({
sourceMap: config.build.productionSourceMap,
extract: true
})
},
devtool: config.build.productionSourceMap ? '#source-map' : false,
plugins: [
new webpack.DefinePlugin({
'process.env': env
}),
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
}),
new ExtractTextPlugin({
filename: utils.assetsPath('css/[name].css')
}),
new OptimizeCSSPlugin({
cssProcessorOptions: {
safe: true
}
}),
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, '../static'),
to: config.build.assetsSubDirectory,
ignore: ['.*']
}
])
]
});
if (config.build.productionGzip) {
const CompressionWebpackPlugin = require('compression-webpack-plugin');
webpackConfig.plugins.push(
new CompressionWebpackPlugin({
asset: '[path].gz[query]',
algorithm: 'gzip',
test: new RegExp(
'\\.(' +
config.build.productionGzipExtensions.join('|') +
')$'
),
threshold: 10240,
minRatio: 0.8
})
)
}
module.exports = webpackConfig;
入口文件:
const install = function(Vue, opts = {}) {
Object.keys(components).forEach(key => {
Vue.component(key, components[key]);
});
Vue.prototype.$Modal = lanModal;
Vue.prototype.$Message = lanMessage;
Vue.prototype.$messageBox = lanMessageBox;
};
if (typeof window !== 'undefined' && window.Vue) {
install(window.Vue);
};
export default {
version: '0.0.9',
install,
...components
};
按照上述打包打包出来的是一个完整的js文件,但是我想要的是打包出来是一个所有组件的对象,求问?打包配置哪里不对吗
0
打赏
收藏
点击回答
- 共 0 条
- 全部回答
-
白丝妖娆 普通会员 1楼
在webpack打包vue项目时,由于项目的打包依赖,例如vue-router、vue-element-admin等,这些依赖的js文件并不会被打包进最终的dist文件中,而是会作为依赖项被引入。这就导致了在dist文件中并不直接有这些依赖项的js文件。
为了在打包后的dist文件中包含这些依赖项的js文件,需要在webpack配置中进行一些设置。例如,可以将这些依赖项的js文件打包进单独的js文件中,然后在打包后的dist文件中通过import语句导入这些js文件。
此外,也可以将这些依赖项的js文件作为插件进行打包,然后在需要的时候通过使用这些插件来引入这些js文件。这种方式的优点是可以保证在dist文件中包含了所有的依赖项的js文件,但是缺点是需要安装和配置这些插件,而且插件的引入和使用可能会比直接引入js文件稍微复杂一些。
更多回答
网站公告
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
