dev.js
// NOTE H5 端使用 devServer 实现跨域，需要修改 package.json 的运行命令，加入环境变量
const isH5 = process.env.CLIENT_ENV === ‘h5‘
const HOST = ‘"https://miniapp.you.163.com"‘
const HOST_M = ‘"https://m.you.163.com"‘
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
}
}
}
}
}
*****************
prod.js
const isH5 = process.env.CLIENT_ENV === ‘h5‘
const HOST = ‘"https://miniapp.you.163.com"‘
const HOST_M = ‘"https://m.you.163.com"‘
// XXX 搭了个 proxy 用于演示 prod 环境的 H5
const HOST_H5 = ‘"http://jsnewbee.com/taro-yanxuan/api"‘
const HOST_M_H5 = ‘"http://jsnewbee.com/taro-yanxuan/api-m"‘
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-yanxuan‘,
date: ‘2019-2-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‘))
}
