Skip to content
This repository was archived by the owner on Apr 15, 2020. It is now read-only.

Commit 60cc5f2

Browse files
pi0pi0
committed
Initial
0 parents  commit 60cc5f2

22 files changed

+4974
-0
lines changed

‎.editorconfig

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
root = true
2+
3+
[*]
4+
indent_style = space
5+
indent_size = 2
6+
end_of_line = lf
7+
charset = utf-8
8+
trim_trailing_whitespace = true
9+
insert_final_newline = true
10+
11+
[*.md]
12+
trim_trailing_whitespace = false

‎.eslintrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "vue"
3+
}

‎.gitignore

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
node_modules
2+
*.log
3+
.DS_Store
4+
/dist

‎README.md

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
# vuepack-bootstrap-example
2+
3+
To start:
4+
5+
```bash
6+
$ npm install
7+
```
8+
9+
To develop:
10+
11+
```bash
12+
$ npm run dev```
13+
14+
To build for production:
15+
16+
```bash
17+
$ npm run build
18+
```
19+
20+
To lint you code:
21+
22+
```bash
23+
$ npm run lint
24+
```
25+

‎build/config.js

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
'use strict'
2+
const pkg = require('../package')
3+
4+
module.exports = {
5+
port: 4000,
6+
title: 'vuepack-bootstrap-example',
7+
// when you use electron please set to relative path like ./
8+
// otherwise only set to absolute path when you're using history mode
9+
publicPath: '/',
10+
// add these dependencies to a standalone vendor bundle
11+
vendor: Object.keys(pkg.dependencies),
12+
// disable babelrc by default
13+
babel: {
14+
babelrc: false,
15+
presets: [
16+
['es2015', {modules: false}],
17+
'stage-1'
18+
],
19+
// support jsx in render function
20+
plugins: [
21+
'transform-vue-jsx'
22+
]
23+
},
24+
postcss: [
25+
// add prefix via postcss since it's faster
26+
require('autoprefixer')({
27+
// Vue does not support ie 8 and below
28+
browsers: ['last 2 versions', 'ie > 8']
29+
}),
30+
require('postcss-nested')
31+
],
32+
cssModules: false,
33+
}

‎build/index.html

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
5+
<title><%= htmlWebpackPlugin.options.title %></title>
6+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/css/bootstrap.min.css" integrity="sha384-AysaV+vQoT3kOAXZkl02PThvDr8HYKPZhNT5h/CXfBThSRXQ6jW5DO2ekP5ViFdi" crossorigin="anonymous"> </head>
7+
<body>
8+
<div id="app"></div>
9+
</body>
10+
</html>

‎build/server.js

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
'use strict'
2+
const fs = require('fs')
3+
const path = require('path')
4+
const chalk = require('chalk')
5+
const express = require('express')
6+
const webpack = require('webpack')
7+
const webpackConfig = require('./webpack.dev')
8+
const config = require('./config')
9+
10+
const app = express()
11+
12+
const port = config.port
13+
webpackConfig.entry.client = [
14+
`webpack-hot-middleware/client?reload=true`,
15+
webpackConfig.entry.client
16+
]
17+
18+
let compiler
19+
20+
try {
21+
compiler = webpack(webpackConfig)
22+
} catch (err) {
23+
console.log(err.message)
24+
process.exit(1)
25+
}
26+
27+
const devMiddleWare = require('webpack-dev-middleware')(compiler, {
28+
publicPath: webpackConfig.output.publicPath,
29+
stats: {
30+
colors: true,
31+
modules: false,
32+
children: false,
33+
chunks: false,
34+
chunkModules: false,
35+
hash: false,
36+
timings: false
37+
}
38+
})
39+
app.use(devMiddleWare)
40+
app.use(require('webpack-hot-middleware')(compiler))
41+
42+
const mfs = devMiddleWare.fileSystem
43+
const file = path.join(webpackConfig.output.path, 'index.html')
44+
45+
console.log(`\n > VuePack is running at ${chalk.yellow(`http://localhost:${port}`)}\n`)
46+
47+
48+
devMiddleWare.waitUntilValid()
49+
50+
app.get('*', (req, res) => {
51+
devMiddleWare.waitUntilValid(() => {
52+
const html = mfs.readFileSync(file)
53+
res.end(html)
54+
})
55+
})
56+
57+
app.listen(port)

‎build/utils.js

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
'use strict'
2+
const path = require('path')
3+
const ExtractTextPlugin = require('extract-text-webpack-plugin')
4+
const config = require('./config')
5+
6+
const _ = module.exports = {}
7+
8+
_.cwd = (file) => {
9+
return path.join(process.cwd(), file || '')
10+
}
11+
12+
_.cssLoader = config.cssModules ?
13+
'css-loader?-autoprefixer&modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]' :
14+
'css-loader?-autoprefixer'
15+
16+
_.outputPath = config.electron ?
17+
path.join(__dirname, '../app/dist') :
18+
path.join(__dirname, '../dist')
19+
20+
_.outputIndexPath = config.electron ?
21+
path.join(__dirname, '../app/dist/index.html') :
22+
path.join(__dirname, '../dist/index.html')
23+
24+
_.target = config.electron ?
25+
'electron-renderer' :
26+
'web'
27+
28+
// https://github.com/egoist/vbuild/blob/master/lib/vue-loaders.js
29+
_.loadersOptions = () => {
30+
const isProd = process.env.NODE_ENV === 'production'
31+
32+
function generateLoader(langs) {
33+
langs.unshift('css-loader?sourceMap&-autoprefixer')
34+
if (!isProd) {
35+
return ['vue-style-loader'].concat(langs).join('!')
36+
}
37+
return ExtractTextPlugin.extract({
38+
fallbackLoader: 'vue-style-loader',
39+
loader: langs.join('!')
40+
})
41+
}
42+
43+
return {
44+
minimize: isProd,
45+
options: {
46+
// css-loader relies on context
47+
context: process.cwd(),
48+
// postcss plugins apply to .css files
49+
postcss: config.postcss,
50+
babel: config.babel,
51+
vue: {
52+
// postcss plugins apply to css in .vue files
53+
postcss: config.postcss,
54+
loaders: {
55+
css: generateLoader([]),
56+
sass: generateLoader(['sass-loader?indentedSyntax&sourceMap']),
57+
scss: generateLoader(['sass-loader?sourceMap']),
58+
less: generateLoader(['less-loader?sourceMap']),
59+
stylus: generateLoader(['stylus-loader?sourceMap']),
60+
js: 'babel-loader'
61+
}
62+
}
63+
}
64+
}
65+
}

‎build/webpack.base.js

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
'use strict'
2+
const path = require('path')
3+
const webpack = require('webpack')
4+
const HtmlWebpackPlugin = require('html-webpack-plugin')
5+
const CopyWebpackPlugin = require('copy-webpack-plugin')
6+
const config = require('./config')
7+
const _ = require('./utils')
8+
9+
module.exports = {
10+
entry: {
11+
client: './client/index.js'
12+
},
13+
output: {
14+
path: _.outputPath,
15+
filename: '[name].js',
16+
publicPath: config.publicPath
17+
},
18+
performance: {
19+
hints: process.env.NODE_ENV === 'production' ? 'warning' : false
20+
},
21+
resolve: {
22+
extensions: ['.js', '.vue', '.css', '.json'],
23+
alias: {
24+
root: path.join(__dirname, '../client'),
25+
components: path.join(__dirname, '../client/components')
26+
},
27+
modules: [
28+
_.cwd('node_modules'),
29+
// this meanse you can get rid of dot hell
30+
// for example import 'components/Foo' instead of import '../../components/Foo'
31+
_.cwd('client')
32+
]
33+
},
34+
module: {
35+
loaders: [
36+
{
37+
test: /\.vue$/,
38+
loaders: ['vue-loader']
39+
},
40+
{
41+
test: /\.js$/,
42+
loaders: ['babel-loader'],
43+
exclude: [/node_modules/]
44+
},
45+
{
46+
test: /\.es6$/,
47+
loaders: ['babel-loader']
48+
},
49+
{
50+
test: /\.(ico|jpg|png|gif|eot|otf|webp|ttf|woff|woff2)(\?.*)?$/,
51+
loader: 'file-loader',
52+
query: {
53+
name: 'static/media/[name].[hash:8].[ext]'
54+
}
55+
},
56+
{
57+
test: /\.svg$/,
58+
loader: 'raw-loader'
59+
}
60+
]
61+
},
62+
plugins: [
63+
new HtmlWebpackPlugin({
64+
title: config.title,
65+
template: __dirname + '/index.html',
66+
filename: _.outputIndexPath
67+
}),
68+
new webpack.LoaderOptionsPlugin(_.loadersOptions()),
69+
new CopyWebpackPlugin([
70+
{
71+
from: _.cwd('./static'),
72+
// to the roor of dist path
73+
to: './'
74+
}
75+
])
76+
],
77+
target: _.target
78+
}

‎build/webpack.dev.js

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
'use strict'
2+
process.env.NODE_ENV = 'development'
3+
4+
const webpack = require('webpack')
5+
const base = require('./webpack.base')
6+
const _ = require('./utils')
7+
8+
base.devtool = 'eval-source-map'
9+
base.plugins.push(
10+
new webpack.DefinePlugin({
11+
'process.env.NODE_ENV': JSON.stringify('development')
12+
}),
13+
new webpack.HotModuleReplacementPlugin(),
14+
new webpack.NoErrorsPlugin()
15+
)
16+
17+
// push loader for .css file
18+
base.module.loaders.push(
19+
{
20+
test: /\.css$/,
21+
loaders: ['style-loader', _.cssLoader, 'postcss-loader']
22+
}
23+
)
24+
25+
module.exports = base

‎build/webpack.prod.js

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
'use strict'
2+
process.env.NODE_ENV = 'production'
3+
4+
const exec = require('child_process').execSync
5+
const webpack = require('webpack')
6+
const ExtractTextPlugin = require('extract-text-webpack-plugin')
7+
const ProgressPlugin = require('webpack/lib/ProgressPlugin')
8+
const base = require('./webpack.base')
9+
const pkg = require('../package')
10+
const _ = require('./utils')
11+
const config = require('./config')
12+
13+
if (config.electron) {
14+
// remove dist folder in electron mode
15+
exec('rm -rf app/assets/')
16+
} else {
17+
// remove dist folder in web app mode
18+
exec('rm -rf dist/')
19+
// use source-map in web app mode
20+
base.devtool = 'source-map'
21+
}
22+
23+
// a white list to add dependencies to vendor chunk
24+
base.entry.vendor = config.vendor
25+
// use hash filename to support long-term caching
26+
base.output.filename = '[name].[chunkhash:8].js'
27+
// add webpack plugins
28+
base.plugins.push(
29+
new ProgressPlugin(),
30+
new ExtractTextPlugin('styles.[contenthash:8].css'),
31+
new webpack.DefinePlugin({
32+
'process.env.NODE_ENV': JSON.stringify('production')
33+
}),
34+
new webpack.optimize.UglifyJsPlugin({
35+
sourceMap: true,
36+
compress: {
37+
warnings: false
38+
},
39+
output: {
40+
comments: false
41+
}
42+
}),
43+
// extract vendor chunks
44+
new webpack.optimize.CommonsChunkPlugin({
45+
name: 'vendor',
46+
filename: 'vendor.[chunkhash:8].js'
47+
})
48+
)
49+
50+
// extract css in standalone .css files
51+
base.module.loaders.push({
52+
test: /\.css$/,
53+
loader: ExtractTextPlugin.extract({
54+
loader: [_.cssLoader, 'postcss-loader'],
55+
fallbackLoader: 'style-loader'
56+
})
57+
})
58+
59+
module.exports = base

0 commit comments

Comments
 (0)