mirror of
https://github.com/wahyd4/vuepress.git
synced 2026-08-27 14:15:52 +10:00
152 lines
3.8 KiB
JavaScript
152 lines
3.8 KiB
JavaScript
const path = require('path')
|
|
|
|
module.exports = function createBaseConfig ({
|
|
sourceDir,
|
|
publicPath = '/',
|
|
layoutPath = path.resolve(__dirname, '../default-theme/App.vue')
|
|
}) {
|
|
const Config = require('webpack-chain')
|
|
const { VueLoaderPlugin } = require('vue-loader')
|
|
const CSSExtractPlugin = require('mini-css-extract-plugin')
|
|
|
|
const isProd = process.env.NODE_ENV === 'production'
|
|
const inlineLimit = 10000
|
|
|
|
const config = new Config()
|
|
|
|
config
|
|
.set('mode', isProd ? 'production' : 'development')
|
|
.devtool(isProd ? 'source-map' : false)
|
|
.output
|
|
.path(path.resolve(sourceDir, '_dist'))
|
|
.filename(isProd ? 'js/[name].[chunkhash:8].js' : 'js/[name].js')
|
|
.publicPath(publicPath)
|
|
|
|
config.resolve
|
|
.set('symlinks', true)
|
|
.alias
|
|
.set('~layout', layoutPath)
|
|
.end()
|
|
.extensions
|
|
.merge(['.js', '.jsx', '.vue', '.json'])
|
|
.end()
|
|
.modules
|
|
.add('node_modules')
|
|
.add(path.resolve(sourceDir, '../node_modules'))
|
|
.add(path.resolve(__dirname, '../../node_modules'))
|
|
|
|
config.resolveLoader
|
|
.set('symlinks', true)
|
|
.modules
|
|
.add('node_modules')
|
|
.add(path.resolve(sourceDir, '../node_modules'))
|
|
.add(path.resolve(__dirname, '../../node_modules'))
|
|
|
|
config.module
|
|
.noParse(/^(vue|vue-router|vuex|vuex-router-sync)$/)
|
|
|
|
config.module
|
|
.rule('vue')
|
|
.test(/\.vue$/)
|
|
.use('vue-loader')
|
|
.loader('vue-loader')
|
|
.options({
|
|
compilerOptions: {
|
|
preserveWhitespace: false
|
|
}
|
|
})
|
|
|
|
config.module
|
|
.rule('markdown')
|
|
.test(/\.md$/)
|
|
.use('vue-loader')
|
|
.loader('vue-loader')
|
|
.options({
|
|
compilerOptions: {
|
|
preserveWhitespace: false
|
|
}
|
|
})
|
|
.end()
|
|
.use('markdown-to-vue-loader')
|
|
.loader('markdown-to-vue-loader')
|
|
|
|
config.module
|
|
.rule('images')
|
|
.test(/\.(png|jpe?g|gif)(\?.*)?$/)
|
|
.use('url-loader')
|
|
.loader('url-loader')
|
|
.options({
|
|
limit: inlineLimit,
|
|
name: `img/[name].[hash:8].[ext]`
|
|
})
|
|
|
|
// do not base64-inline SVGs.
|
|
// https://github.com/facebookincubator/create-react-app/pull/1180
|
|
config.module
|
|
.rule('svg')
|
|
.test(/\.(svg)(\?.*)?$/)
|
|
.use('file-loader')
|
|
.loader('file-loader')
|
|
.options({
|
|
name: `img/[name].[hash:8].[ext]`
|
|
})
|
|
|
|
config.module
|
|
.rule('media')
|
|
.test(/\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/)
|
|
.use('url-loader')
|
|
.loader('url-loader')
|
|
.options({
|
|
limit: inlineLimit,
|
|
name: `media/[name].[hash:8].[ext]`
|
|
})
|
|
|
|
config.module
|
|
.rule('fonts')
|
|
.test(/\.(woff2?|eot|ttf|otf)(\?.*)?$/i)
|
|
.use('url-loader')
|
|
.loader('url-loader')
|
|
.options({
|
|
limit: inlineLimit,
|
|
name: `fonts/[name].[hash:8].[ext]`
|
|
})
|
|
|
|
function createCSSRule (lang, test, loader, options) {
|
|
const rule = config.module
|
|
.rule(lang)
|
|
.test(test)
|
|
|
|
if (isProd) {
|
|
rule
|
|
.use('extract-css-loader').loader(CSSExtractPlugin.loader).end()
|
|
.use('css-loader').loader('css-loader').options({ minimize: true })
|
|
} else {
|
|
rule
|
|
.use('vue-style-loader').loader('vue-style-loader').end()
|
|
.use('css-loader').loader('css-loader')
|
|
}
|
|
|
|
if (loader) {
|
|
rule.use(loader).loader(loader).options(options)
|
|
}
|
|
}
|
|
|
|
createCSSRule('css', /\.css$/)
|
|
createCSSRule('scss', /\.scss$/, 'sass-loader')
|
|
createCSSRule('sass', /\.sass$/, 'sass-loader', { indentedSyntax: true })
|
|
createCSSRule('less', /\.less$/, 'less-loader')
|
|
createCSSRule('stylus', /\.styl(us)?$/, 'stylus-loader')
|
|
|
|
config
|
|
.plugin('vue-loader')
|
|
.use(VueLoaderPlugin)
|
|
|
|
if (isProd) {
|
|
config
|
|
.plugin('extract-css')
|
|
.use(CSSExtractPlugin, [{ filename: 'css/styles.[hash:8].css' }])
|
|
}
|
|
|
|
return config
|
|
}
|