taro 1.3.4配置 config的index配置文件

偏执的太偏执、 2023-01-17 09:18 266阅读 0赞

复制代码 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'))  
    \}