新增桌面歌词

This commit is contained in:
lyswhut
2020-06-11 21:16:59 +08:00
parent 25fc0226aa
commit 2a81d41c2c
107 changed files with 6935 additions and 1543 deletions
+11
View File
@@ -7,6 +7,7 @@ const Spinnies = require('spinnies')
const mainConfig = require('./main/webpack.config.prod')
const rendererConfig = require('./renderer/webpack.config.prod')
const rendererLyricConfig = require('./renderer-lyric/webpack.config.prod')
const errorLog = chalk.bgRed.white(' ERROR ') + ' '
const okayLog = chalk.bgGreen.white(' OKAY ') + ' '
@@ -18,6 +19,7 @@ function build() {
const spinners = new Spinnies({ color: 'blue' })
spinners.add('main', { text: 'main building' })
spinners.add('renderer', { text: 'renderer building' })
spinners.add('renderer-lyric', { text: 'renderer-lyric building' })
let results = ''
// m.on('success', () => {
@@ -52,6 +54,15 @@ function build() {
console.error(`\n${err}\n`)
process.exit(1)
}),
pack(rendererLyricConfig).then(result => {
results += result + '\n\n'
spinners.succeed('renderer-lyric', { text: 'renderer-lyric build success!' })
}).catch(err => {
spinners.fail('renderer-lyric', { text: 'renderer-lyric build fail :(' })
console.log(`\n ${errorLog}failed to build renderer-lyric process`)
console.error(`\n${err}\n`)
process.exit(1)
}),
]).then(handleSuccess)
}
@@ -1,22 +1,27 @@
const path = require('path')
const webpack = require('webpack')
const HTMLPlugin = require('html-webpack-plugin')
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const HTMLPlugin = require('html-webpack-plugin')
const vueLoaderConfig = require('../vue-loader.config')
module.exports = {
target: 'web',
entry: path.join(__dirname, '../../src/renderer/main.js'),
target: 'electron-renderer',
entry: {
'renderer-lyric': path.join(__dirname, '../../src/renderer-lyric/main.js'),
},
output: {
path: path.join(__dirname, '../../dist/web'),
filename: '[name].js',
libraryTarget: 'commonjs2',
path: path.join(__dirname, '../../dist/electron'),
publicPath: './',
},
resolve: {
alias: {
'@': path.join(__dirname, '../../src/renderer'),
common: path.join(__dirname, '../../src/common'),
},
extensions: ['*', '.js', '.vue', '.json', '.css'],
extensions: ['*', '.js', '.json', '.vue', '.node'],
},
module: {
rules: [
@@ -57,22 +62,26 @@ module.exports = {
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
use: {
loader: 'url-loader',
options: {
limit: 10000,
name: 'imgs/[name].[ext]',
},
loader: 'url-loader',
options: {
limit: 10000,
name: 'imgs/[name]--[folder].[ext]',
},
},
{
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: 'media/[name]--[folder].[ext]',
},
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
use: {
loader: 'url-loader',
options: {
limit: 10000,
name: 'fonts/[name].[ext]',
},
loader: 'url-loader',
options: {
limit: 10000,
name: 'fonts/[name]--[folder].[ext]',
},
},
],
@@ -81,17 +90,13 @@ module.exports = {
maxEntrypointSize: 300000,
},
plugins: [
new VueLoaderPlugin(),
new HTMLPlugin({
filename: 'index.html',
template: path.resolve(__dirname, '../../src/index.pug'),
nodeModules: false,
filename: 'lyric.html',
template: path.join(__dirname, '../../src/renderer-lyric/index.pug'),
isProd: process.env.NODE_ENV == 'production',
browser: process.browser,
__dirname,
}),
new webpack.DefinePlugin({
'process.env.IS_WEB': 'true',
}),
new VueLoaderPlugin(),
],
}
@@ -1,8 +1,9 @@
const path = require('path')
const webpack = require('webpack')
const merge = require('webpack-merge')
const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
const merge = require('webpack-merge')
const baseConfig = require('./webpack.config.base')
const { mergeCSSLoaderDev } = require('../utils')
@@ -10,10 +11,6 @@ const { mergeCSSLoaderDev } = require('../utils')
module.exports = merge(baseConfig, {
mode: 'development',
devtool: 'eval-source-map',
output: {
filename: '[name].js',
path: path.join(__dirname, '../../dist/web'),
},
module: {
rules: [
{
@@ -30,7 +27,7 @@ module.exports = merge(baseConfig, {
}),
},
{
test: /\.styl$/,
test: /\.styl(:?us)?$/,
oneOf: mergeCSSLoaderDev({
loader: 'stylus-loader',
options: {
@@ -41,14 +38,16 @@ module.exports = merge(baseConfig, {
],
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
new FriendlyErrorsPlugin(),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"development"',
ELECTRON_DISABLE_SECURITY_WARNINGS: 'true',
},
__static: `"${path.join(__dirname, '../../src/static').replace(/\\/g, '\\\\')}"`,
}),
new FriendlyErrorsPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
],
performance: {
hints: false,
@@ -1,21 +1,25 @@
const path = require('path')
const webpack = require('webpack')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const merge = require('webpack-merge')
const TerserPlugin = require('terser-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
const TerserPlugin = require('terser-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const merge = require('webpack-merge')
const baseConfig = require('./webpack.config.base')
const { mergeCSSLoaderProd } = require('../utils')
const { dependencies } = require('../../package.json')
let whiteListedModules = ['vue']
module.exports = merge(baseConfig, {
mode: 'production',
devtool: false,
output: {
filename: '[name].[chunkhash:8].js',
},
externals: [
...Object.keys(dependencies || {}).filter(d => !whiteListedModules.includes(d)),
],
module: {
rules: [
{
@@ -32,7 +36,7 @@ module.exports = merge(baseConfig, {
}),
},
{
test: /\.styl$/,
test: /\.styl(:?us)?$/,
oneOf: mergeCSSLoaderProd({
loader: 'stylus-loader',
options: {
@@ -43,20 +47,21 @@ module.exports = merge(baseConfig, {
],
},
plugins: [
new CopyWebpackPlugin([
{
from: path.join(__dirname, '../../src/static'),
to: path.join(__dirname, '../dist/web/static'),
ignore: ['.*'],
},
]),
new CopyWebpackPlugin({
patterns: [
{
from: path.join(__dirname, '../../src/static'),
to: path.join(__dirname, '../../dist/electron/static'),
},
],
}),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"',
},
}),
new MiniCssExtractPlugin({
filename: '[name].[contentHash:8].css',
filename: '[name].css',
}),
new webpack.NamedChunksPlugin(),
],
@@ -69,26 +74,14 @@ module.exports = merge(baseConfig, {
}),
new OptimizeCSSAssetsPlugin({}),
],
splitChunks: {
cacheGroups: {
// chunks: 'all',
vendors: {
test: /[\\/]node_modules[\\/]/,
name: 'vendors',
enforce: true,
chunks: 'all',
},
styles: {
name: 'styles',
test: /\.(css|less)$/,
chunks: 'all',
enforce: true,
},
},
},
runtimeChunk: true,
},
performance: {
hints: 'warning',
},
node: {
__dirname: false,
__filename: false,
},
})
+1 -1
View File
@@ -92,7 +92,7 @@ module.exports = {
plugins: [
new HTMLPlugin({
filename: 'index.html',
template: path.join(__dirname, '../../src/index.pug'),
template: path.join(__dirname, '../../src/renderer/index.pug'),
isProd: process.env.NODE_ENV == 'production',
browser: process.browser,
__dirname,
+50
View File
@@ -12,6 +12,7 @@ const webpackHotMiddleware = require('webpack-hot-middleware')
const mainConfig = require('./main/webpack.config.dev')
const rendererConfig = require('./renderer/webpack.config.dev')
const rendererLyricConfig = require('./renderer-lyric/webpack.config.dev')
let electronProcess = null
let manualRestart = false
@@ -65,6 +66,53 @@ function startRenderer() {
})
}
function startRendererLyric() {
return new Promise((resolve, reject) => {
// rendererConfig.entry.renderer = [path.join(__dirname, 'dev-client')].concat(rendererConfig.entry.renderer)
// rendererConfig.mode = 'development'
const compiler = webpack(rendererLyricConfig)
hotMiddleware = webpackHotMiddleware(compiler, {
log: false,
heartbeat: 2500,
})
compiler.hooks.compilation.tap('compilation', compilation => {
// console.log(Object.keys(compilation.hooks))
HtmlWebpackPlugin.getHooks(compilation).beforeEmit.tapAsync('html-webpack-plugin-after-emit', (data, cb) => {
hotMiddleware.publish({ action: 'reload' })
cb()
})
})
compiler.hooks.done.tap('done', stats => {
// logStats('Renderer', 'Compile done')
// logStats('Renderer', stats)
})
const server = new WebpackDevServer(
compiler,
{
contentBase: path.join(__dirname, '../'),
quiet: true,
hot: true,
historyApiFallback: true,
clientLogLevel: 'warning',
overlay: {
errors: true,
},
before(app, ctx) {
app.use(hotMiddleware)
ctx.middleware.waitUntilValid(() => {
resolve()
})
},
},
)
server.listen(9081)
})
}
function startMain() {
return new Promise((resolve, reject) => {
// mainConfig.entry.main = [path.join(__dirname, '../src/main/index.dev.js')].concat(mainConfig.entry.main)
@@ -140,6 +188,7 @@ function init() {
const spinners = new Spinnies({ color: 'blue' })
spinners.add('main', { text: 'main compiling' })
spinners.add('renderer', { text: 'renderer compiling' })
spinners.add('renderer-lyric', { text: 'renderer-lyric compiling' })
function handleSuccess(name) {
spinners.succeed(name, { text: name + ' compile success!' })
}
@@ -149,6 +198,7 @@ function init() {
Promise.all([
startRenderer().then(() => handleSuccess('renderer')).catch(() => handleFail('renderer')),
startRendererLyric().then(() => handleSuccess('renderer-lyric')).catch(() => handleFail('renderer-lyric')),
startMain().then(() => handleSuccess('main')).catch(() => handleFail('main')),
]).then(startElectron).catch(err => {
console.error(err)