Skip to content

Commit a0fd8b7

Browse files
uncleLianuncleLian
committed
update
1 parent a7ee2a9 commit a0fd8b7

File tree

15 files changed

+548
-547
lines changed

15 files changed

+548
-547
lines changed

‎build/utils.js‎

Lines changed: 76 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -5,101 +5,102 @@ const ExtractTextPlugin = require('extract-text-webpack-plugin')
55
const packageConfig = require('../package.json')
66

77
exports.assetsPath = function (_path) {
8-
const assetsSubDirectory = process.env.NODE_ENV === 'production'
9-
? config.build.assetsSubDirectory
10-
: config.dev.assetsSubDirectory
8+
const assetsSubDirectory = process.env.NODE_ENV === 'production'
9+
? config.build.assetsSubDirectory
10+
: config.dev.assetsSubDirectory
1111

12-
return path.posix.join(assetsSubDirectory, _path)
12+
return path.posix.join(assetsSubDirectory, _path)
1313
}
1414

1515
exports.cssLoaders = function (options) {
16-
options = options || {}
16+
options = options || {}
1717

18-
const cssLoader = {
19-
loader: 'css-loader',
20-
options: {
21-
sourceMap: options.sourceMap
18+
const cssLoader = {
19+
loader: 'css-loader',
20+
options: {
21+
sourceMap: options.sourceMap
22+
}
2223
}
23-
}
2424

25-
const postcssLoader = {
26-
loader: 'postcss-loader',
27-
options: {
28-
sourceMap: options.sourceMap
25+
const postcssLoader = {
26+
loader: 'postcss-loader',
27+
options: {
28+
sourceMap: options.sourceMap
29+
}
2930
}
30-
}
3131

32-
// generate loader string to be used with extract text plugin
33-
function generateLoaders (loader, loaderOptions) {
34-
const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
35-
36-
if (loader) {
37-
loaders.push({
38-
loader: loader + '-loader',
39-
options: Object.assign({}, loaderOptions, {
40-
sourceMap: options.sourceMap
41-
})
42-
})
32+
// generate loader string to be used with extract text plugin
33+
function generateLoaders(loader, loaderOptions) {
34+
const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
35+
36+
if (loader) {
37+
loaders.push({
38+
loader: loader + '-loader',
39+
options: Object.assign({}, loaderOptions, {
40+
sourceMap: options.sourceMap
41+
})
42+
})
43+
}
44+
45+
// Extract CSS when that option is specified
46+
// (which is the case during production build)
47+
if (options.extract) {
48+
return ExtractTextPlugin.extract({
49+
use: loaders,
50+
fallback: 'vue-style-loader'
51+
})
52+
} else {
53+
return ['vue-style-loader'].concat(loaders)
54+
}
4355
}
4456

45-
// Extract CSS when that option is specified
46-
// (which is the case during production build)
47-
if (options.extract) {
48-
return ExtractTextPlugin.extract({
49-
use: loaders,
50-
fallback: 'vue-style-loader'
51-
})
52-
} else {
53-
return ['vue-style-loader'].concat(loaders)
57+
// https://vue-loader.vuejs.org/en/configurations/extract-css.html
58+
// 修改：引入css目录
59+
var cssDir = path.resolve(__dirname, '../src/assets/css')
60+
return {
61+
css: generateLoaders(),
62+
postcss: generateLoaders(),
63+
less: generateLoaders('less'),
64+
sass: generateLoaders('sass', { indentedSyntax: true }),
65+
scss: generateLoaders('sass'),
66+
// 修改：引入css目录下所有.styl后缀的文件，所有.vue文件都可以使用文件里的变量和方法
67+
stylus: generateLoaders('stylus', {
68+
import: [cssDir + '/*.styl']
69+
}),
70+
styl: generateLoaders('stylus')
5471
}
55-
}
56-
57-
// https://vue-loader.vuejs.org/en/configurations/extract-css.html
58-
// css目录
59-
var cssDir = path.resolve(__dirname, '../src/assets/css')
60-
return {
61-
css: generateLoaders(),
62-
postcss: generateLoaders(),
63-
less: generateLoaders('less'),
64-
sass: generateLoaders('sass', { indentedSyntax: true }),
65-
scss: generateLoaders('sass'),
66-
stylus: generateLoaders('stylus', {
67-
import: [cssDir+'/*.styl']
68-
}),
69-
styl: generateLoaders('stylus')
70-
}
7172
}
7273

7374
// Generate loaders for standalone style files (outside of .vue)
7475
exports.styleLoaders = function (options) {
75-
const output = []
76-
const loaders = exports.cssLoaders(options)
77-
78-
for (const extension in loaders) {
79-
const loader = loaders[extension]
80-
output.push({
81-
test: new RegExp('\\.' + extension + '$'),
82-
use: loader
83-
})
84-
}
85-
86-
return output
76+
const output = []
77+
const loaders = exports.cssLoaders(options)
78+
79+
for (const extension in loaders) {
80+
const loader = loaders[extension]
81+
output.push({
82+
test: new RegExp('\\.' + extension + '$'),
83+
use: loader
84+
})
85+
}
86+
87+
return output
8788
}
8889

8990
exports.createNotifierCallback = () => {
90-
const notifier = require('node-notifier')
91+
const notifier = require('node-notifier')
9192

92-
return (severity, errors) => {
93-
if (severity !== 'error') return
93+
return (severity, errors) => {
94+
if (severity !== 'error') return
9495

95-
const error = errors[0]
96-
const filename = error.file && error.file.split('!').pop()
96+
const error = errors[0]
97+
const filename = error.file && error.file.split('!').pop()
9798

98-
notifier.notify({
99-
title: packageConfig.name,
100-
message: severity + ': ' + error.name,
101-
subtitle: filename || '',
102-
icon: path.join(__dirname, 'logo.png')
103-
})
104-
}
99+
notifier.notify({
100+
title: packageConfig.name,
101+
message: severity + ': ' + error.name,
102+
subtitle: filename || '',
103+
icon: path.join(__dirname, 'logo.png')
104+
})
105+
}
105106
}

‎build/webpack.base.conf.js‎

Lines changed: 78 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -4,89 +4,89 @@ const utils = require('./utils')
44
const config = require('../config')
55
const vueLoaderConfig = require('./vue-loader.conf')
66

7-
function resolve (dir) {
8-
return path.join(__dirname, '..', dir)
7+
function resolve(dir) {
8+
return path.join(__dirname, '..', dir)
99
}
1010

1111
const createLintingRule = () => ({
12-
test: /\.(js|vue)$/,
13-
loader: 'eslint-loader',
14-
enforce: 'pre',
15-
include: [resolve('src'), resolve('test')],
16-
options: {
17-
formatter: require('eslint-friendly-formatter'),
18-
emitWarning: !config.dev.showEslintErrorsInOverlay
19-
}
12+
test: /\.(js|vue)$/,
13+
loader: 'eslint-loader',
14+
enforce: 'pre',
15+
include: [resolve('src'), resolve('test')],
16+
options: {
17+
formatter: require('eslint-friendly-formatter'),
18+
emitWarning: !config.dev.showEslintErrorsInOverlay
19+
}
2020
})
2121

2222
module.exports = {
23-
context: path.resolve(__dirname, '../'),
24-
entry: {
25-
app: './src/main.js'
26-
},
27-
output: {
28-
path: config.build.assetsRoot,
29-
filename: '[name].js',
30-
publicPath: process.env.NODE_ENV === 'production'
31-
? config.build.assetsPublicPath
32-
: config.dev.assetsPublicPath
33-
},
34-
resolve: {
35-
extensions: ['.js', '.vue', '.json'],
36-
alias: {
37-
'vue$': 'vue/dist/vue.esm.js',
38-
'@': resolve('src'),
39-
}
40-
},
41-
module: {
42-
rules: [
43-
...(config.dev.useEslint ? [createLintingRule()] : []),
44-
{
45-
test: /\.vue$/,
46-
loader: 'vue-loader',
47-
options: vueLoaderConfig
48-
},
49-
{
50-
test: /\.js$/,
51-
loader: 'babel-loader',
52-
include: [resolve('src'), resolve('test')]
53-
},
54-
{
55-
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
56-
loader: 'url-loader',
57-
options: {
58-
limit: 10000,
59-
name: utils.assetsPath('img/[name].[hash:7].[ext]')
60-
}
61-
},
62-
{
63-
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
64-
loader: 'url-loader',
65-
options: {
66-
limit: 10000,
67-
name: utils.assetsPath('media/[name].[hash:7].[ext]')
23+
context: path.resolve(__dirname, '../'),
24+
entry: {
25+
app: './src/main.js'
26+
},
27+
output: {
28+
path: config.build.assetsRoot,
29+
filename: '[name].js',
30+
publicPath: process.env.NODE_ENV === 'production'
31+
? config.build.assetsPublicPath
32+
: config.dev.assetsPublicPath
33+
},
34+
resolve: {
35+
extensions: ['.js', '.vue', '.json'],
36+
alias: {
37+
'vue$': 'vue/dist/vue.esm.js',
38+
'@': resolve('src'),
6839
}
69-
},
70-
{
71-
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
72-
loader: 'url-loader',
73-
options: {
74-
limit: 10000,
75-
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
76-
}
77-
}
78-
]
79-
},
80-
node: {
81-
// prevent webpack from injecting useless setImmediate polyfill because Vue
82-
// source contains it (although only uses it if it's native).
83-
setImmediate: false,
84-
// prevent webpack from injecting mocks to Node native modules
85-
// that does not make sense for the client
86-
dgram: 'empty',
87-
fs: 'empty',
88-
net: 'empty',
89-
tls: 'empty',
90-
child_process: 'empty'
91-
}
40+
},
41+
module: {
42+
rules: [
43+
...(config.dev.useEslint ? [createLintingRule()] : []),
44+
{
45+
test: /\.vue$/,
46+
loader: 'vue-loader',
47+
options: vueLoaderConfig
48+
},
49+
{
50+
test: /\.js$/,
51+
loader: 'babel-loader',
52+
include: [resolve('src'), resolve('test')]
53+
},
54+
{
55+
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
56+
loader: 'url-loader',
57+
options: {
58+
limit: 10000,
59+
name: utils.assetsPath('img/[name].[hash:7].[ext]')
60+
}
61+
},
62+
{
63+
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
64+
loader: 'url-loader',
65+
options: {
66+
limit: 10000,
67+
name: utils.assetsPath('media/[name].[hash:7].[ext]')
68+
}
69+
},
70+
{
71+
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
72+
loader: 'url-loader',
73+
options: {
74+
limit: 10000,
75+
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
76+
}
77+
}
78+
]
79+
},
80+
node: {
81+
// prevent webpack from injecting useless setImmediate polyfill because Vue
82+
// source contains it (although only uses it if it's native).
83+
setImmediate: false,
84+
// prevent webpack from injecting mocks to Node native modules
85+
// that does not make sense for the client
86+
dgram: 'empty',
87+
fs: 'empty',
88+
net: 'empty',
89+
tls: 'empty',
90+
child_process: 'empty'
91+
}
9292
}

0 commit comments

Comments
 (0)