• taro1.3.4版本 config index配置


     dev.js
        // NOTE H5 端使用 devServer 实现跨域,需要修改 package.json 的运行命令,加入环境变量
        const isH5 = process.env.CLIENT_ENV === 'h5'
        const HOST = '"https://min"'
        const HOST_M = '"https://"'
        
        module.exports = {
            env: {
             NODE_ENV: '"development"'
            },
            defineConstants: {
                HOST: isH5 ? '"/api"' : HOST,
                HOST_M: isH5 ? '"/api-m"' : HOST_M
            },
            weapp: {},
            h5: {
                devServer: {
                    proxy: {
                        '/api/': {
                            target: JSON.parse(HOST),
                            pathRewrite: {
                            '^/api/': '/'
                            },
                            changeOrigin: true
                        },
                        '/api-m/': {
                            target: JSON.parse(HOST_M),
                            pathRewrite: {
                            '^/api-m/': '/'
                            },
                            changeOrigin: true
                        }
                    }
                }
            }
        }
       <hr>
        prod.js
        const isH5 = process.env.CLIENT_ENV === 'h5'
        
        const HOST = '"https://mi"'
        const HOST_M = '"https://m"'
        
        // XXX 搭了个 proxy 用于演示 prod 环境的 H5
        const HOST_H5 = '"http://"'
        const HOST_M_H5 = '"http://"'
        
        module.exports = {
            env: {
                NODE_ENV: '"production"'
            },
            defineConstants: {
                HOST: isH5 ? HOST_H5 : HOST,
                HOST_M: isH5 ? HOST_M_H5 : HOST_M
            },
            weapp: {},
            h5: {
                publicPath: '/taro-yanxuan'
            }
        }
         
        ******************
        index.js:
        const path = require('path')
        
        // NOTE 在 sass 中通过别名(@ 或 ~)引用需要指定路径
        const sassImporter = function(url) {
            if (url[0] === '~' && url[1] !== '/') {
            return {
            file: path.resolve(__dirname, '..', 'node_modules', url.substr(1))
            }
        }
        
        const reg = /^@styles/(.*)/
            return {
                file: reg.test(url) ? path.resolve(__dirname, '..', 'src/styles', url.match(reg)[1]) : url
            }
        }
        
        const config = {
            projectName: 'taro-demo',
            date: '2019-12-1',
            designWidth: 750,
            deviceRatio: {
                '640': 2.34 / 2,
                '750': 1,
                '828': 1.81 / 2
            },
            sourceRoot: 'src',
            outputRoot: 'dist',
            plugins: {
                babel: {
                    sourceMap: true,
                    presets: [
                        ['env', {
                        modules: false
                        }]
                    ],
                    plugins: [
                        'transform-decorators-legacy',
                        'transform-class-properties',
                        'transform-object-rest-spread'
                    ]
                },
                sass: {
                    importer: sassImporter
                }
            },
            defineConstants: {
            },
            alias: {
                '@actions': path.resolve(__dirname, '..', 'src/actions'),
                '@assets': path.resolve(__dirname, '..', 'src/assets'),
                '@components': path.resolve(__dirname, '..', 'src/components'),
                '@constants': path.resolve(__dirname, '..', 'src/constants'),
                '@reducers': path.resolve(__dirname, '..', 'src/reducers'),
                '@styles': path.resolve(__dirname, '..', 'src/styles'),
                '@utils': path.resolve(__dirname, '..', 'src/utils')
            },
            copy: {
                patterns: [
                ],
                options: {
                }
            },
            weapp: {
                module: {
                    postcss: {
                        autoprefixer: {
                            enable: true,
                            config: {
                            browsers: [
                                'last 3 versions',
                                'Android >= 4.1',
                                'ios >= 8'
                                ]
                            }
                        },
                        pxtransform: {
                            enable: true,
                            config: {
                            
                            }
                        },
                        url: {
                            enable: true,
                            config: {
                            limit: 10240 // 设定转换尺寸上限
                            }
                        },
                        cssModules: {
                            enable: false, // 默认为 false,如需使用 css modules 功能,则设为 true
                            config: {
                            namingPattern: 'module', // 转换模式,取值为 global/module
                            generateScopedName: '[name]__[local]___[hash:base64:5]'
                            }
                        }
                    }
                }
            },
        h5: {
            // NOTE H5 打包静态资源时带 hash 值,方便缓存、版本管理
            publicPath: '/',
            staticDirectory: 'static',
            output: {
                filename: 'js/[name].[hash].js',
                chunkFilename: 'js/[name].[chunkhash].js'
            },
            imageUrlLoaderOption: {
                limit: 5000,
                name: 'static/images/[name].[hash].[ext]'
            },
            miniCssExtractPluginOption: {
                filename: 'css/[name].[hash].css',
                chunkFilename: 'css/[name].[chunkhash].css',
            },
            module: {
                postcss: {
                    autoprefixer: {
                        enable: true,
                        config: {
                            browsers: [
                                'last 3 versions',
                                'Android >= 4.1',
                                'ios >= 8'
                            ]
                        }
                    },
                    cssModules: {
                        enable: false, // 默认为 false,如需使用 css modules 功能,则设为 true
                        config: {
                            namingPattern: 'module', // 转换模式,取值为 global/module
                            generateScopedName: '[name]__[local]___[hash:base64:5]'
                        }
                   }
                }
            },
                sassLoaderOption: {
                    importer: sassImporter
                }
            },
            rn: {
                appJson: {
                    // NOTE taro-native-shell 中默认用的是 taroDemo
                    name: 'taroDemo'
                }
            }
        }
        
        module.exports = function (merge) {
            if (process.env.NODE_ENV === 'development') {
            return merge({}, config, require('./dev'))
            }
            return merge({}, config, require('./prod'))
        }

  • 相关阅读:
    【简报】一款使用静态图片生成动画的jQuery插件:JZoopraxiscope
    使用jQuery timelinr和animate.css创建超酷的CSS动画时间轴特效
    超酷信息图分享:你属于哪类geek?
    数据库操作优化
    android R.java aapt
    xml sax 解析 & 符号
    sql server2000 完全卸载
    cmd 命令总结
    手动打包 解释
    bat 执行 java jar包
  • 原文地址:https://www.cnblogs.com/pikachuworld/p/12259545.html
Copyright © 2020-2023  润新知