配置文件tsconfig.json的path属性:
{ "compilerOptions": { "target": "es2017", "module": "commonjs", "removeComments": false, "preserveConstEnums": true, "moduleResolution": "node", "experimentalDecorators": true, "noImplicitAny": false, "allowSyntheticDefaultImports": true, "outDir": "lib", "noUnusedLocals": true, "noUnusedParameters": true, "strictNullChecks": true, "sourceMap": true, "baseUrl": ".", "rootDir": ".", "jsx": "react", "jsxFactory": "React.createElement", "allowJs": true, "resolveJsonModule": true, "typeRoots": [ "node_modules/@types", "global.d.ts" ], "paths": { "@components/*": ["src/components/*"], "@hooks/*": ["src/hooks/*"], "@assets/*": ["src/assets/*"], // css, html中需要 `~@assets/*` } }, "exclude": [ "node_modules", "dist" ], "compileOnSave": false }
配置文件:
config/index.js的alias属性
const path = require('path') const config = { projectName: 'mini', date: '2020-8-6', designWidth: 750, deviceRatio: { 640: 2.34 / 2, 750: 1, 828: 1.81 / 2 }, sourceRoot: 'src', outputRoot: `dist/${process.env.TARO_ENV}`, plugins: [], defineConstants: { }, copy: { patterns: [ ], options: { } }, framework: 'react', mini: { postcss: { pxtransform: { enable: true, config: { } }, url: { enable: true, config: { limit: 1024 // 设定转换尺寸上限 } }, cssModules: { enable: false, // 默认为 false,如需使用 css modules 功能,则设为 true config: { namingPattern: 'module', // 转换模式,取值为 global/module generateScopedName: '[name]__[local]___[hash:base64:5]' } } } }, h5: { publicPath: '/', staticDirectory: 'static', postcss: { autoprefixer: { enable: true, config: { } }, cssModules: { enable: false, // 默认为 false,如需使用 css modules 功能,则设为 true config: { namingPattern: 'module', // 转换模式,取值为 global/module generateScopedName: '[name]__[local]___[hash:base64:5]' } } } }, alias: { '@components': path.resolve(__dirname, '..', 'src/components'), '@hooks': path.resolve(__dirname, '..', 'src/hooks'),
'@assets': path.resolve(__dirname, '..', 'src/assets'),
} } module.exports = function (merge) { if (process.env.NODE_ENV === 'development') { return merge({}, config, require('./dev')) } return merge({}, config, require('./prod')) }