diff --git a/.babelrc b/.babelrc index bdb1a6b4d..c998ebb72 100644 --- a/.babelrc +++ b/.babelrc @@ -1,5 +1,17 @@ { - "presets": [["es2015", { "loose": true }]], + "presets": [ + [ + "env", + { + "loose": true, + "modules": false, + "targets": { + "browsers": ["> 1%", "last 2 versions", "not ie <= 8"] + } + } + ], + "stage-2" + ], "plugins": ["transform-vue-jsx"], "env": { "utils": { @@ -11,6 +23,9 @@ } }] ] + }, + "test": { + "plugins": ["istanbul"] } } } diff --git a/.eslintrc b/.eslintrc index 2a84035cf..7e75b60a9 100644 --- a/.eslintrc +++ b/.eslintrc @@ -12,8 +12,8 @@ "no-restricted-globals": ["error", "event", "fdescribe"] }, "parserOptions": { + "ecmaVersion": 6, "ecmaFeatures": { - "experimentalObjectRestSpread": true, "jsx": true } } diff --git a/build/bin/build-entry.js b/build/bin/build-entry.js index 4958573e7..b68e5a872 100644 --- a/build/bin/build-entry.js +++ b/build/bin/build-entry.js @@ -49,7 +49,7 @@ if (typeof window !== 'undefined' && window.Vue) { install(window.Vue); } -module.exports = { +export default { version: '{{version}}', locale: locale.use, i18n: locale.i18n, @@ -58,8 +58,6 @@ module.exports = { Loading, {{list}} }; - -module.exports.default = module.exports; `; delete Components.font; diff --git a/build/webpack.common.js b/build/webpack.common.js index e9a6085c8..6357fb78c 100644 --- a/build/webpack.common.js +++ b/build/webpack.common.js @@ -1,10 +1,11 @@ const path = require('path'); -const webpack = require('webpack'); const ProgressBarPlugin = require('progress-bar-webpack-plugin'); +const VueLoaderPlugin = require('vue-loader/lib/plugin'); const config = require('./config'); module.exports = { + mode: 'production', entry: { app: ['./src/index.js'] }, @@ -21,6 +22,15 @@ module.exports = { modules: ['node_modules'] }, externals: config.externals, + performance: { + hints: false + }, + stats: { + children: false + }, + optimization: { + minimize: false + }, module: { rules: [ { @@ -33,13 +43,11 @@ module.exports = { test: /\.vue$/, loader: 'vue-loader', options: { - preserveWhitespace: false + compilerOptions: { + preserveWhitespace: false + } } }, - { - test: /\.json$/, - loader: 'json-loader' - }, { test: /\.css$/, loaders: ['style-loader', 'css-loader', 'postcss-loader'] @@ -49,27 +57,7 @@ module.exports = { loaders: ['style-loader', 'css-loader', 'sass-loader'] }, { - test: /\.html$/, - loader: 'html-loader?minimize=false' - }, - { - test: /\.otf|ttf|woff2?|eot(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.svg(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.(gif|png|jpe?g)(\?\S*)?$/, + test: /\.(svg|otf|ttf|woff2?|eot|gif|png|jpe?g)(\?\S*)?$/, loader: 'url-loader', query: { limit: 10000, @@ -80,11 +68,6 @@ module.exports = { }, plugins: [ new ProgressBarPlugin(), - new webpack.DefinePlugin({ - 'process.env.NODE_ENV': JSON.stringify('production') - }), - new webpack.LoaderOptionsPlugin({ - minimize: true - }) + new VueLoaderPlugin() ] }; diff --git a/build/webpack.component.js b/build/webpack.component.js index e4d4fa6b7..e6291a9d8 100644 --- a/build/webpack.component.js +++ b/build/webpack.component.js @@ -1,11 +1,12 @@ const path = require('path'); -const webpack = require('webpack'); const ProgressBarPlugin = require('progress-bar-webpack-plugin'); +const VueLoaderPlugin = require('vue-loader/lib/plugin'); const Components = require('../components.json'); const config = require('./config'); const webpackConfig = { + mode: 'production', entry: Components, output: { path: path.resolve(process.cwd(), './lib'), @@ -20,6 +21,13 @@ const webpackConfig = { modules: ['node_modules'] }, externals: config.externals, + performance: { + hints: false + }, + stats: 'none', + optimization: { + minimize: false + }, module: { rules: [ { @@ -32,13 +40,11 @@ const webpackConfig = { test: /\.vue$/, loader: 'vue-loader', options: { - preserveWhitespace: false + compilerOptions: { + preserveWhitespace: false + } } }, - { - test: /\.json$/, - loader: 'json-loader' - }, { test: /\.css$/, loaders: ['style-loader', 'css-loader', 'postcss-loader'] @@ -48,27 +54,7 @@ const webpackConfig = { loaders: ['style-loader', 'css-loader', 'sass-loader'] }, { - test: /\.html$/, - loader: 'html-loader?minimize=false' - }, - { - test: /\.otf|ttf|woff2?|eot(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.svg(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.(gif|png|jpe?g)(\?\S*)?$/, + test: /\.(svg|otf|ttf|woff2?|eot|gif|png|jpe?g)(\?\S*)?$/, loader: 'url-loader', query: { limit: 10000, @@ -79,12 +65,7 @@ const webpackConfig = { }, plugins: [ new ProgressBarPlugin(), - new webpack.DefinePlugin({ - 'process.env.NODE_ENV': JSON.stringify('production') - }), - new webpack.LoaderOptionsPlugin({ - minimize: true - }) + new VueLoaderPlugin() ] }; diff --git a/build/webpack.conf.js b/build/webpack.conf.js index 1f7300126..65fbdfa23 100644 --- a/build/webpack.conf.js +++ b/build/webpack.conf.js @@ -1,10 +1,11 @@ const path = require('path'); -const webpack = require('webpack'); const ProgressBarPlugin = require('progress-bar-webpack-plugin'); +const VueLoaderPlugin = require('vue-loader/lib/plugin'); const config = require('./config'); module.exports = { + mode: 'production', entry: { app: ['./src/index.js'] }, @@ -24,6 +25,12 @@ module.exports = { externals: { vue: config.vue }, + performance: { + hints: false + }, + stats: { + children: false + }, module: { rules: [ { @@ -36,13 +43,11 @@ module.exports = { test: /\.vue$/, loader: 'vue-loader', options: { - preserveWhitespace: false + compilerOptions: { + preserveWhitespace: false + } } }, - { - test: /\.json$/, - loader: 'json-loader' - }, { test: /\.css$/, loaders: ['style-loader', 'css-loader', 'postcss-loader'] @@ -52,27 +57,7 @@ module.exports = { loaders: ['style-loader', 'css-loader', 'sass-loader'] }, { - test: /\.html$/, - loader: 'html-loader?minimize=false' - }, - { - test: /\.otf|ttf|woff2?|eot(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.svg(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.(gif|png|jpe?g)(\?\S*)?$/, + test: /\.(svg|otf|ttf|woff2?|eot|gif|png|jpe?g)(\?\S*)?$/, loader: 'url-loader', query: { limit: 10000, @@ -83,20 +68,6 @@ module.exports = { }, plugins: [ new ProgressBarPlugin(), - new webpack.DefinePlugin({ - 'process.env.NODE_ENV': JSON.stringify('production') - }), - new webpack.optimize.UglifyJsPlugin({ - compress: { - warnings: false - }, - output: { - comments: false - }, - sourceMap: false - }), - new webpack.LoaderOptionsPlugin({ - minimize: true - }) + new VueLoaderPlugin() ] }; diff --git a/build/webpack.demo.js b/build/webpack.demo.js index e341926c2..8bceca084 100644 --- a/build/webpack.demo.js +++ b/build/webpack.demo.js @@ -1,9 +1,10 @@ const path = require('path'); const webpack = require('webpack'); +const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const CopyWebpackPlugin = require('copy-webpack-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin'); -const ExtractTextPlugin = require('extract-text-webpack-plugin'); const ProgressBarPlugin = require('progress-bar-webpack-plugin'); +const VueLoaderPlugin = require('vue-loader/lib/plugin'); const md = require('markdown-it')(); const slugify = require('transliteration').slugify; @@ -11,7 +12,6 @@ const striptags = require('./strip-tags'); const config = require('./config'); const isProd = process.env.NODE_ENV === 'production'; -const isDev = process.env.NODE_ENV === 'development'; const isPlay = !!process.env.PLAY_ENV; function convert(str) { @@ -30,6 +30,7 @@ function wrap(render) { } const webpackConfig = { + mode: process.env.NODE_ENV, entry: isProd ? { docs: './examples/entry.js', 'element-ui': './src/index.js' @@ -51,18 +52,18 @@ const webpackConfig = { publicPath: '/', noInfo: true }, + performance: { + hints: false + }, + stats: { + children: false + }, module: { rules: [ { enforce: 'pre', - test: /\.jsx?$/, - exclude: /node_modules|bower_components/, - loader: 'eslint-loader' - }, - { - enforce: 'pre', - test: /\.vue$/, - exclude: /node_modules|bower_components/, + test: /\.(vue|jsx?)$/, + exclude: /node_modules/, loader: 'eslint-loader' }, { @@ -72,86 +73,92 @@ const webpackConfig = { loader: 'babel-loader' }, { - test: /\.md$/, - loader: 'vue-markdown-loader', + test: /\.vue$/, + loader: 'vue-loader', options: { - use: [ - [require('markdown-it-anchor'), { - level: 2, - slugify: slugify, - permalink: true, - permalinkBefore: true - }], - [require('markdown-it-container'), 'demo', { - validate: function(params) { - return params.trim().match(/^demo\s*(.*)$/); - }, - - render: function(tokens, idx) { - var m = tokens[idx].info.trim().match(/^demo\s*(.*)$/); - if (tokens[idx].nesting === 1) { - var description = (m && m.length > 1) ? m[1] : ''; - var content = tokens[idx + 1].content; - var html = convert(striptags.strip(content, ['script', 'style'])).replace(/(<[^>]*)=""(?=.*>)/g, '$1'); - var script = striptags.fetch(content, 'script'); - var style = striptags.fetch(content, 'style'); - var jsfiddle = { html: html, script: script, style: style }; - var descriptionHTML = description - ? md.render(description) - : ''; - - jsfiddle = md.utils.escapeHtml(JSON.stringify(jsfiddle)); - - return ` -
${html}
- ${descriptionHTML} -
`; - } - return '
\n'; - } - }], - [require('markdown-it-container'), 'tip'], - [require('markdown-it-container'), 'warning'] - ], - preprocess: function(MarkdownIt, source) { - MarkdownIt.renderer.rules.table_open = function() { - return ''; - }; - MarkdownIt.renderer.rules.fence = wrap(MarkdownIt.renderer.rules.fence); - return source; + compilerOptions: { + preserveWhitespace: false } } }, { - test: /\.json$/, - loader: 'json-loader' + test: /\.css$/, + loaders: [ + isProd ? MiniCssExtractPlugin.loader : 'style-loader', + 'css-loader', + 'postcss-loader' + ] }, { test: /\.scss$/, - loaders: ['style-loader', 'css-loader', 'sass-loader'] + loaders: [ + isProd ? MiniCssExtractPlugin.loader : 'style-loader', + 'css-loader', + 'sass-loader' + ] }, { - test: /\.html$/, - loader: 'html-loader?minimize=false' + test: /\.md$/, + loaders: [ + { + loader: 'vue-loader' + }, + { + loader: 'vue-markdown-loader/lib/markdown-compiler', + options: { + preventExtract: true, + raw: true, + preprocess: function(MarkdownIt, source) { + MarkdownIt.renderer.rules.table_open = function() { + return '
'; + }; + MarkdownIt.renderer.rules.fence = wrap(MarkdownIt.renderer.rules.fence); + return source; + }, + use: [ + [require('markdown-it-anchor'), { + level: 2, + slugify: slugify, + permalink: true, + permalinkBefore: true + }], + [require('markdown-it-container'), 'demo', { + validate: function(params) { + return params.trim().match(/^demo\s*(.*)$/); + }, + + render: function(tokens, idx) { + var m = tokens[idx].info.trim().match(/^demo\s*(.*)$/); + if (tokens[idx].nesting === 1) { + var description = (m && m.length > 1) ? m[1] : ''; + var content = tokens[idx + 1].content; + var html = convert(striptags.strip(content, ['script', 'style'])).replace(/(<[^>]*)=""(?=.*>)/g, '$1'); + var script = striptags.fetch(content, 'script'); + var style = striptags.fetch(content, 'style'); + var jsfiddle = { html: html, script: script, style: style }; + var descriptionHTML = description + ? md.render(description) + : ''; + + jsfiddle = md.utils.escapeHtml(JSON.stringify(jsfiddle)); + + return ` +
${html}
+ ${descriptionHTML} +
`; + } + return '
\n'; + } + }], + [require('markdown-it-container'), 'tip'], + [require('markdown-it-container'), 'warning'] + ] + } + } + ] }, { - test: /\.otf|ttf|woff2?|eot(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.svg(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.(gif|png|jpe?g)(\?\S*)?$/, + test: /\.(svg|otf|ttf|woff2?|eot|gif|png|jpe?g)(\?\S*)?$/, loader: 'url-loader', query: { limit: 10000, @@ -170,80 +177,21 @@ const webpackConfig = { { from: 'examples/versions.json' } ]), new ProgressBarPlugin(), + new VueLoaderPlugin(), new webpack.LoaderOptionsPlugin({ - minimize: true, vue: { - preserveWhitespace: false + compilerOptions: { + preserveWhitespace: false + } } }) ] }; if (isProd) { - webpackConfig.externals = { - vue: 'Vue', - 'vue-router': 'VueRouter' - }; - webpackConfig.module.rules.push( - { - test: /\.vue$/, - loader: 'vue-loader', - options: { - extractCSS: true, - preserveWhitespace: false - } - }, - { - test: /\.css$/, - loader: ExtractTextPlugin.extract({ - fallback: 'style-loader', - use: [ - { loader: 'css-loader', options: { importLoaders: 1 } }, - 'postcss-loader' - ] - }) - } - ); webpackConfig.plugins.push( - new webpack.optimize.UglifyJsPlugin({ - compress: { - warnings: false - }, - output: { - comments: false - }, - sourceMap: false - }), - new ExtractTextPlugin({ + new MiniCssExtractPlugin({ filename: '[name].[contenthash:7].css' - }), - new webpack.DefinePlugin({ - 'process.env.NODE_ENV': JSON.stringify('production') - }), - new webpack.optimize.CommonsChunkPlugin({ - name: ['element-ui', 'manifest'] - }) - ); -} -if (isDev) { - webpackConfig.module.rules.push( - { - test: /\.vue$/, - loader: 'vue-loader', - options: { - preserveWhitespace: false - } - }, - { - test: /\.css$/, - loaders: ['style-loader', 'css-loader', 'postcss-loader'] - } - ); - webpackConfig.plugins.push( - new webpack.HotModuleReplacementPlugin(), - new webpack.NamedModulesPlugin(), - new webpack.DefinePlugin({ - 'process.env.NODE_ENV': JSON.stringify('development') }) ); } diff --git a/build/webpack.test.js b/build/webpack.test.js index 54f4f515c..3588bd195 100644 --- a/build/webpack.test.js +++ b/build/webpack.test.js @@ -1,9 +1,11 @@ const path = require('path'); const ProgressBarPlugin = require('progress-bar-webpack-plugin'); +const VueLoaderPlugin = require('vue-loader/lib/plugin'); const config = require('./config'); const webpackConfig = { + mode: 'development', entry: { app: ['./src/index.js'] }, @@ -23,14 +25,6 @@ const webpackConfig = { devtool: '#inline-source-map', module: { rules: [ - { - enforce: 'post', - test: /\.jsx?$/, - loader: 'isparta-loader', - options: { esModules: true }, - exclude: config.jsexclude, - include: /src|packages/ - }, { test: /\.(jsx?|babel|es6)$/, include: process.cwd(), @@ -41,42 +35,17 @@ const webpackConfig = { test: /\.vue$/, loader: 'vue-loader', options: { - loaders: { - js: process.env.CI_ENV ? 'isparta-loader' : 'isparta-loader!eslint-loader' - }, - preserveWhitespace: false + compilerOptions: { + preserveWhitespace: false + } } }, - { - test: /\.json$/, - loader: 'json-loader' - }, { test: /\.css$/, loaders: ['style-loader', 'css-loader', 'postcss-loader'] }, { - test: /\.html$/, - loader: 'html-loader?minimize=false' - }, - { - test: /\.otf|ttf|woff2?|eot(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.svg(\?\S*)?$/, - loader: 'url-loader', - query: { - limit: 10000, - name: path.posix.join('static', '[name].[hash:7].[ext]') - } - }, - { - test: /\.(gif|png|jpe?g)(\?\S*)?$/, + test: /\.(svg|otf|ttf|woff2?|eot|gif|png|jpe?g)(\?\S*)?$/, loader: 'url-loader', query: { limit: 10000, @@ -86,6 +55,7 @@ const webpackConfig = { ] }, plugins: [ + new VueLoaderPlugin() ] }; diff --git a/examples/app.vue b/examples/app.vue index b74619c2a..0b32ccb5d 100644 --- a/examples/app.vue +++ b/examples/app.vue @@ -1,178 +1,3 @@ - -