Skip to content

Instantly share code, notes, and snippets.

@gwuhaolin

gwuhaolin/package.json

Last active April 20, 2022 10:32
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save gwuhaolin/cebd252a23793e742e6acae90ab63e83 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save gwuhaolin/cebd252a23793e742e6acae90ab63e83 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. gwuhaolin revised this gist Jul 7, 2017. 3 changed files with 225 additions and 55 deletions.
    39 changes: 39 additions & 0 deletions package.json
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,39 @@
    {
    "scripts": {
    "dev": "webpack-dev-server --hot --open",
    "dist": "rm -rf public && NODE_ENV=production webpack --config webpack-dist.config.js --display-optimization-bailout",
    "jbdist": "tnpm i && NODE_ENV=production webpack --config webpack-dist.config.js"
    },
    "dependencies": {
    "babel-runtime": "^6.23.0",
    "badjs-report": "^1.3.2",
    "classnames": "^2.2.5",
    "core-js": "^2.4.1",
    "mobx": "^3.1.16",
    "mobx-react": "^4.2.2",
    "normalize.css": "^7.0.0",
    "prop-types": "^15.5.10",
    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-router-dom": "^4.1.1",
    },
    "devDependencies": {
    "babel-core": "^6.25.0",
    "babel-loader": "^7.1.1",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "css-loader": "^0.28.4",
    "end-webpack-plugin": "^1.0.0",
    "extract-text-webpack-plugin": "^2.1.2",
    "file-loader": "^0.11.2",
    "ncp": "^2.0.0",
    "node-sass": "^4.5.3",
    "sass-loader": "^6.0.6",
    "style-loader": "^0.18.2",
    "web-webpack-plugin": "^1.8.2",
    "webpack": "^3.0.0",
    "webpack-dev-server": "^2.5.0"
    }
    }
    167 changes: 137 additions & 30 deletions webpack-dist.config.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,37 +1,144 @@
    /* eslint-disable import/no-extraneous-dependencies */
    const fs = require('fs');
    const path = require('path');
    const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin');
    const ModuleConcatenationPlugin = require('webpack/lib/optimize/ModuleConcatenationPlugin');
    const DefinePlugin = require('webpack/lib/DefinePlugin');
    let distConfig = require('./webpack.config');
    const CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin');
    const ExtractTextPlugin = require('extract-text-webpack-plugin');
    const EndWebpackPlugin = require('end-webpack-plugin');
    const ncp = require('ncp').ncp;
    const { AutoWebPlugin } = require('web-webpack-plugin');
    const { name } = require('./package.json');

    distConfig.output.path = path.resolve(__dirname, 'public/cdn');
    distConfig.output.publicPath = '//url.cn/';
    distConfig.output.filename = '[chunkhash].js';
    distConfig.resolve.alias = {
    'moment': 'moment/min/moment.min.js',
    'react': 'react/dist/react.min.js',
    'react-dom': 'react-dom/dist/react-dom.min.js'
    const CND = {
    js: `//7.url.cn/edu/${name}/`,
    css: `//8.url.cn/edu/${name}/`,
    img: `//9.url.cn/edu/${name}/`
    };
    distConfig.plugins.push(...[
    new DefinePlugin({
    'process.env': {
    'NODE_ENV': JSON.stringify('production')
    }
    }),
    new UglifyJsPlugin({
    // 最紧凑的输出
    beautify: false,
    // 删除所有的注释
    comments: false,
    compress: {
    // 在UglifyJs删除没有用到的代码时不输出警告
    warnings: false,
    // 删除所有的 `console` 语句，可以兼容ie浏览器
    drop_console: true,
    // 内嵌定义了但是只用到一次的变量
    collapse_vars: true,
    // 提取出出现多次但是没有定义成变量去引用的静态值
    reduce_vars: true,

    const autoPlugin = new AutoWebPlugin('./src/pages/', {
    template: (pageName) => {
    let templatePath = path.resolve('./src/pages/', pageName, 'template.html');
    if (fs.existsSync(templatePath)) {
    return templatePath;
    }
    return './src/assets/template.html';
    },
    commonsChunk: {
    name: 'common',
    // 超过4个以上的页面都用到的公共模块就抽取到common里去
    minChunks: 4,
    },
    // 所有的css文件都放在8.url.cn
    stylePublicPath: CND.css,
    });

    module.exports = {
    entry: autoPlugin.entry({
    vendor: './src/assets/vendor',
    }),
    ])
    module.exports = distConfig;
    output: {
    path: path.resolve(__dirname, `public/cdn/${name}`),
    publicPath: CND.js,
    filename: '[name]_[chunkhash].js',
    },
    resolve: {
    // 加快搜索速度
    modules: [path.resolve(__dirname, 'node_modules')],
    // es tree-shaking
    mainFields: ['jsnext:main', 'browser', 'main'],
    // 加快编译速度
    alias: {
    moment: 'moment/min/moment.min.js',
    },
    extensions: ['.jsx', '.js'],
    },
    module: {
    // 这些库都是不依赖其它库的库 不需要解析他们可以加快编译速度
    noParse: /node_modules\/(moment|chart\.js)/,
    rules: [
    {
    test: /\.jsx?$/,
    // cacheDirectory 缓存babel编译结果加快重新编译速度
    loader: 'babel-loader?cacheDirectory',
    // 只命中src目录里的js文件，加快webpack搜索速度
    include: path.resolve(__dirname, 'src')
    },
    {
    test: /\.js$/,
    // 加载 imui 里的 @require '.css'
    loaders: ['comment-require-loader'],
    include: path.resolve(__dirname, 'node_modules/imui')
    },
    {
    test: /\.scss$/,
    // 提取出css
    loaders: ExtractTextPlugin.extract({
    // 通过css加载的文件都放在9.url.cn
    publicPath: CND.img,
    fallback: 'style-loader',
    // 压缩css
    use: ['css-loader?minimize', 'sass-loader']
    }),
    include: path.resolve(__dirname, 'src')
    },
    {
    test: /\.css$/,
    // 提取出css
    loaders: ExtractTextPlugin.extract({
    // 通过css加载的文件都放在9.url.cn
    publicPath: CND.img,
    fallback: 'style-loader',
    // 压缩css
    use: ['css-loader?minimize'],
    }),
    },
    {
    test: /\.(gif|png|jpe?g|eot|woff|ttf|svg|pdf)$/,
    loader: 'file-loader',
    },
    ]
    },
    plugins: [
    new DefinePlugin({
    'process.env': {
    // 'NODE_ENV': JSON.stringify('production')
    NODE_ENV: JSON.stringify(process.env.NODE_ENV)
    }
    }),
    new UglifyJsPlugin({
    // 最紧凑的输出
    beautify: false,
    // 删除所有的注释
    comments: false,
    compress: {
    // 在UglifyJs删除没有用到的代码时不输出警告
    warnings: false,
    // 删除所有的 `console` 语句，可以兼容ie浏览器
    drop_console: true,
    // 内嵌定义了但是只用到一次的变量
    collapse_vars: true,
    // 提取出出现多次但是没有定义成变量去引用的静态值
    reduce_vars: true,
    }
    }),
    // webpack3 Scope Hoisting
    new ModuleConcatenationPlugin(),
    new ExtractTextPlugin({
    filename: '[name]_[contenthash].css',
    allChunks: true,
    }),
    autoPlugin,
    // 所有页面都会用到的基础运行环境
    new CommonsChunkPlugin({
    name: 'vendor',
    chunks: ['vendor', 'common']
    }),
    new EndWebpackPlugin(() => {
    ncp('public/cdn', 'public/webserver');
    // 微信公众号验证文件
    ncp('src/assets/MP_verify_hm4fH3NBUiMW0hpo.txt', 'public/webserver');
    })
    ],
    };
    74 changes: 49 additions & 25 deletions webpack.config.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,9 +1,28 @@
    const fs = require('fs');
    const path = require('path');
    const IgnorePlugin = require('webpack/lib/IgnorePlugin');
    const AutoWebPlugin = require('web-webpack-plugin').AutoWebPlugin;
    const fs = require('fs');
    const DefinePlugin = require('webpack/lib/DefinePlugin');
    const CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin');
    const { AutoWebPlugin } = require('web-webpack-plugin');

    const autoPlugin = new AutoWebPlugin('./src/pages/', {
    template: (pageName) => {
    let templatePath = path.resolve('./src/pages/', pageName, 'template.html');
    if (fs.existsSync(templatePath)) {
    return templatePath;
    }
    return './src/assets/template.html';
    },
    commonsChunk: {
    name: 'common',
    // 超过4个以上的页面都用到的公共模块就抽取到common里去
    minChunks: 4,
    },
    });

    module.exports = {
    entry: autoPlugin.entry({
    vendor: './src/assets/vendor',
    }),
    output: {
    publicPath: '',
    filename: '[name].js',
    @@ -15,51 +34,56 @@ module.exports = {
    mainFields: ['jsnext:main', 'browser', 'main'],
    // 加快编译速度
    alias: {
    'moment': 'moment/min/moment.min.js',
    'react': 'react/dist/react.js',
    'react-dom': 'react-dom/dist/react-dom.js'
    }
    moment: 'moment/min/moment.min.js',
    },
    // 支持 npm link
    symlinks: true,
    },
    module: {
    // 这些库都是不依赖其它库的库 不需要解析他们可以加快编译速度
    noParse: /node_modules\/(moment|chart\.js)/,
    loaders: [
    rules: [
    {
    test: /\.js$/,
    // cacheDirectory 缓存babel编译结果加快重新编译速度
    loader: 'babel-loader?cacheDirectory',
    // 只命中src目录里的js文件，加快webpack搜索速度
    include: path.resolve(__dirname, 'src')
    },
    {
    test: /\.js$/,
    // 加载 imui 里的 // @require '.css'
    loaders: ['comment-require-loader'],
    include: [path.resolve(__dirname, 'node_modules/imui')]
    },
    {
    test: /\.scss$/,
    // 压缩css
    loaders: ['style-loader', 'css-loader?minimize', 'sass-loader'],
    loaders: ['style-loader', 'css-loader', 'sass-loader'],
    include: path.resolve(__dirname, 'src')
    },
    {
    test: /\.css$/,
    // 压缩css
    loaders: ['style-loader', 'css-loader?minimize'],
    loaders: ['style-loader', 'css-loader'],
    },
    {
    test: /\.(gif|png|eot|woff|ttf|pdf)$/,
    test: /\.(gif|png|jpe?g|eot|woff|ttf|svg|pdf)$/,
    loader: 'file-loader',
    },
    ]
    },
    performance: {
    "hints": false
    },
    entry: {
    badjs: './src/assets/badjs',
    polyfill: './src/assets/polyfill',
    ie_polyfill: './src/assets/ie-polyfill',
    },
    plugins: [
    new AutoWebPlugin('./src/pages/', {
    template: './src/assets/template.html',
    commonsChunk: 'common'
    new DefinePlugin({
    'process.env': {
    // 'NODE_ENV': JSON.stringify('development')
    NODE_ENV: JSON.stringify(process.env.NODE_ENV)
    }
    }),
    autoPlugin,
    // 所有页面都会用到的基础运行环境
    new CommonsChunkPlugin({
    name: 'vendor',
    chunks: ['vendor', 'common']
    }),
    ]
    ],
    devtool: 'source-map',
    };
  2. gwuhaolin created this gist Jan 1, 2017.
    37 changes: 37 additions & 0 deletions webpack-dist.config.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,37 @@
    const path = require('path');
    const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin');
    const DefinePlugin = require('webpack/lib/DefinePlugin');
    let distConfig = require('./webpack.config');

    distConfig.output.path = path.resolve(__dirname, 'public/cdn');
    distConfig.output.publicPath = '//url.cn/';
    distConfig.output.filename = '[chunkhash].js';
    distConfig.resolve.alias = {
    'moment': 'moment/min/moment.min.js',
    'react': 'react/dist/react.min.js',
    'react-dom': 'react-dom/dist/react-dom.min.js'
    };
    distConfig.plugins.push(...[
    new DefinePlugin({
    'process.env': {
    'NODE_ENV': JSON.stringify('production')
    }
    }),
    new UglifyJsPlugin({
    // 最紧凑的输出
    beautify: false,
    // 删除所有的注释
    comments: false,
    compress: {
    // 在UglifyJs删除没有用到的代码时不输出警告
    warnings: false,
    // 删除所有的 `console` 语句，可以兼容ie浏览器
    drop_console: true,
    // 内嵌定义了但是只用到一次的变量
    collapse_vars: true,
    // 提取出出现多次但是没有定义成变量去引用的静态值
    reduce_vars: true,
    }
    }),
    ])
    module.exports = distConfig;
    65 changes: 65 additions & 0 deletions webpack.config.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,65 @@
    const fs = require('fs');
    const path = require('path');
    const IgnorePlugin = require('webpack/lib/IgnorePlugin');
    const AutoWebPlugin = require('web-webpack-plugin').AutoWebPlugin;

    module.exports = {
    output: {
    publicPath: '',
    filename: '[name].js',
    },
    resolve: {
    // 加快搜索速度
    modules: [path.resolve(__dirname, 'node_modules')],
    // es tree-shaking
    mainFields: ['jsnext:main', 'browser', 'main'],
    // 加快编译速度
    alias: {
    'moment': 'moment/min/moment.min.js',
    'react': 'react/dist/react.js',
    'react-dom': 'react-dom/dist/react-dom.js'
    }
    },
    module: {
    // 这些库都是不依赖其它库的库 不需要解析他们可以加快编译速度
    noParse: /node_modules\/(moment|chart\.js)/,
    loaders: [
    {
    test: /\.js$/,
    // cacheDirectory 缓存babel编译结果加快重新编译速度
    loader: 'babel-loader?cacheDirectory',
    // 只命中src目录里的js文件，加快webpack搜索速度
    include: path.resolve(__dirname, 'src')
    },
    {
    test: /\.scss$/,
    // 压缩css
    loaders: ['style-loader', 'css-loader?minimize', 'sass-loader'],
    include: path.resolve(__dirname, 'src')
    },
    {
    test: /\.css$/,
    // 压缩css
    loaders: ['style-loader', 'css-loader?minimize'],
    },
    {
    test: /\.(gif|png|eot|woff|ttf|pdf)$/,
    loader: 'file-loader',
    },
    ]
    },
    performance: {
    "hints": false
    },
    entry: {
    badjs: './src/assets/badjs',
    polyfill: './src/assets/polyfill',
    ie_polyfill: './src/assets/ie-polyfill',
    },
    plugins: [
    new AutoWebPlugin('./src/pages/', {
    template: './src/assets/template.html',
    commonsChunk: 'common'
    }),
    ]
    };