From 2a289b9be27150edaacf84d0297ab3099dbf03f8 Mon Sep 17 00:00:00 2001 From: luckyadam Date: Tue, 14 Jan 2020 18:25:55 +0800 Subject: [PATCH] chore: changelog && docs --- CHANGELOG.md | 21 +- .../version-2.0.1/config-detail.md | 878 ++++++++++++++++++ .../version-2.0.1/css-modules.md | 93 ++ .../version-2.0.1/migrate-to-2.md | 196 ++++ website/versioned_docs/version-2.0.1/size.md | 168 ++++ .../version-2.0.1/static-reference.md | 83 ++ .../versioned_docs/version-2.0.1/ui-lib.md | 125 +++ .../version-2.0.1-sidebars.json | 641 +++++++++++++ website/versions.json | 1 + 9 files changed, 2205 insertions(+), 1 deletion(-) create mode 100644 website/versioned_docs/version-2.0.1/config-detail.md create mode 100644 website/versioned_docs/version-2.0.1/css-modules.md create mode 100644 website/versioned_docs/version-2.0.1/migrate-to-2.md create mode 100644 website/versioned_docs/version-2.0.1/size.md create mode 100644 website/versioned_docs/version-2.0.1/static-reference.md create mode 100644 website/versioned_docs/version-2.0.1/ui-lib.md create mode 100644 website/versioned_sidebars/version-2.0.1-sidebars.json diff --git a/CHANGELOG.md b/CHANGELOG.md index fc1e201b5bb7..083a880930b7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,24 @@ -# [](https://github.com/NervJS/taro/compare/v2.0.0...v) (2020-01-08) +# [](https://github.com/NervJS/taro/compare/v2.0.1...v) (2020-01-14) + + + + +## [2.0.1](https://github.com/NervJS/taro/compare/v2.0.0...v2.0.1) (2020-01-14) + + +### Bug Fixes + +* **mini-runner:** 修复使用 cnpm 等安装器安装依赖时引用 taro-ui 报错的问题，[#5278](https://github.com/NervJS/taro/issues/5278) ([9480496](https://github.com/NervJS/taro/commit/9480496)) +* **mini-runner:** 修复页面文件 watch 时修改的问题，close [#5293](https://github.com/NervJS/taro/issues/5293) ([309f066](https://github.com/NervJS/taro/commit/309f066)) +* **mini-runner:** 添加 mini.compile 配置 ([949fd37](https://github.com/NervJS/taro/commit/949fd37)) +* **weapp/qq:** 微信、qq小程序 request 并发数改为 10，fix [#5291](https://github.com/NervJS/taro/issues/5291) ([474c7aa](https://github.com/NervJS/taro/commit/474c7aa)) + + +### Reverts + +* 去除版本运行提示 ([3b50289](https://github.com/NervJS/taro/commit/3b50289)) +* 恢复运行时的版本提示 ([b006895](https://github.com/NervJS/taro/commit/b006895)) diff --git a/website/versioned_docs/version-2.0.1/config-detail.md b/website/versioned_docs/version-2.0.1/config-detail.md new file mode 100644 index 000000000000..cc4ac574c157 --- /dev/null +++ b/website/versioned_docs/version-2.0.1/config-detail.md @@ -0,0 +1,878 @@ +--- +title: 编译配置详情 +id: version-2.0.1-config-detail +original_id: config-detail +--- + +## designWidth + +`designWidth` 用来设置设计稿尺寸，关于这一部分的配置说明请见[设计稿及尺寸单位](./size.md)这一章节。 + +## sourceRoot + +`sourceRoot` 用来设置源码存放目录，通过 Taro 开发工具初始化后的项目源码目录都是 `src`，你可以通过修改这一配置来重新指定源码目录。 + +## outputRoot + +`outputRoot` 用来设置代码编译后的生产目录，通过 Taro 开发工具初始化后的生产目录都是 `dist`，你可以通过修改这一配置来重新指定生产目录。 + +## plugins + +`plugins` 用来设置编译过程插件，插件机制基于 实现，目前暴露了两个钩子 `beforeBuild` 和 `afterBuild` + +其中，`beforeBuild` 将在整体编译前触发，可以获取到编译的相关配置，同时也能进行修改 + +`afterBuild` 将在 webpack 编译完后执行，可以获取到编译后的结果 + +具体使用方式如下： + +首先定义一个插件 + +```js +class BuildPlugin { + apply (builder) { + builder.hooks.beforeBuild.tap('BuildPlugin', (config) => { + console.log(config) + }) + + builder.hooks.afterBuild.tap('BuildPlugin', (stats) => { + console.log(stats) + }) + } +} +``` + +接下来在 `plugins` 字段中进行配置 + +```js +{ + plugins: [ + new BuildPlugin() + ] +} +``` + +## babel + +用来配置 `babel`，默认配置如下，可以自行添加自己需要的额外的 `presets` 及 `plugins`。 + +```jsx +babel: { + sourceMap: true, + presets: [ + 'env' + ], + plugins: [ + 'transform-class-properties', + 'transform-decorators-legacy', + 'transform-object-rest-spread' + ] +} +``` + +## uglify + +用来配置 `UgligyJS` 工具，设置打包过程中的 JS 代码压缩。可以通过 `uglify.enable` 来设置是否开启压缩，若设置开启，则可以通过 `uglify.config` 来设置 `UgligyJS` 的配置项，具体配置方式如下： + +```jsx +uglify: { + enable: true, + config: { + // 配置项同 https://github.com/mishoo/UglifyJS2#minify-options + } +} +``` + +## csso + +用来配置 `csso` 工具，设置打包过程中的 CSS 代码压缩。可以通过 `csso.enable` 来设置是否开启压缩，若设置开启，则可以通过 `csso.config` 来设置 `csso` 的配置项，具体配置方式如下： + +```jsx +csso: { + enable: true, + config: { + // 配置项同 https://github.com/css/csso#minifysource-options + } +} +``` + +## sass + +用来配置 `sass` 工具，设置打包过程中的 SCSS 代码编译。 +具体配置可以参考[node-sass](https://www.npmjs.com/package/node-sass) +当需要全局注入scss文件时，可以添加三个额外参数：`resource` 、 `projectDirectory` (v1.2.25开始支持)、`data`（v1.3.0开始支持），具体配置方式如下： + +#### 单文件路径形式 + +当只有 `resource` 字段时，可以传入 scss 文件的绝对路径。 + +```js +sass: { + resource: path.resolve(__dirname, '..', 'src/styles/variable.scss') +} +``` + +#### 多文件路径形式 + +此外，当只有 `resource` 字段时，也可以传入一个路径数组。 + +```js +sass: { + resource: [ + path.resolve(__dirname, '..', 'src/styles/variable.scss'), + path.resolve(__dirname, '..', 'src/styles/mixins.scss') + ] +} +``` + +#### 指定项目根目录路径形式 + +你可以额外配置 `projectDirectory` 字段，这样你就可以在 `resource` 里写相对路径了。 + +```js +sass: { + resource: [ + 'src/styles/variable.scss', + 'src/styles/mixins.scss' + ], + projectDirectory: path.resolve(__dirname, '..') +} +``` + +#### 传入 scss 变量字符串 + +```js +sass: { + resource: [ + 'src/styles/variable.scss', + 'src/styles/mixins.scss' + ], + projectDirectory: path.resolve(__dirname, '..'), + data: '$nav-height: 48px;' +} +``` + +* resource: 如果要引入多个文件，支持数组形式传入 +* projectDirectory: 项目根目录的绝对地址(若为小程序云开发模板，则应该是client目录) +* data: 全局 scss 变量，若 data 与 resource 中设置了同样的变量，则 data 的优先级高于 resource + +## env + +用来设置一些环境变量如 `process.env.NODE_ENV`，例如我们想设置区分预览、打包来做些不同的操作，可以如下配置： + +在 `config/dev.js` 中： + +```jsx +env: { + NODE_ENV: '"development"' // JSON.stringify('development') +} +``` + +在 `config/prod.js` 中： + +```jsx +env: { + NODE_ENV: '"production"' // JSON.stringify('production') +} +``` + +这样就能在代码中通过 `process.env.NODE_ENV === 'development'` 来判断环境。 + +## defineConstants + +用来配置一些全局变量供代码中进行使用，配置方式与 [Webpack DefinePlugin](https://webpack.js.org/plugins/define-plugin/) 类似，例如： + +```js +defineConstants: { + A: JSON.stringify('a') // '"a"' +} +``` + +## alias + +> `1.2.0` 开始支持。 + +用来配置目录别名，从而方便书写代码引用路径。例如，使用相对路径书写文件引用如下： + +```js +import A from '../../componnets/A' +import Utils from '../../utils' +import packageJson from '../../package.json' +import projectConfig from '../../project.config.json' +``` + +为了避免书写多级相对路径，我们可以如下配置 `alias`： + +```js +alias: { + '@/components': path.resolve(__dirname, '..', 'src/components'), + '@/utils': path.resolve(__dirname, '..', 'src/utils'), + '@/package': path.resolve(__dirname, '..', 'package.json'), + '@/project': path.resolve(__dirname, '..', 'project.config.json'), +} +``` + +通过上述配置，可以将 `src/components` 和 `src/utils` 目录配置成别名，将根目录下的 `package.json` 和 `project.config.json` 文件配置成别名，则代码中的引用改写如下： + +```js +import A from '@/components/A' +import Utils from '@/utils' +import packageJson from '@/package' +import projectConfig from '@/project' +``` + +为了让编辑器（VS Code）不报错，并继续使用自动路径补全的功能，需要在项目根目录下的 `jsconfig.json` 或者 `tsconfig.json` 中配置 `paths` 让编辑器认得我们的别名，形式如下： + +```json +{ + "compilerOptions": { + "baseUrl": ".", + "paths": { + "@/components/*": ["./src/components/*"], + "@/utils/*": ["./src/utils/*"], + "@/package": ["./package.json"], + "@/project": ["./project.config.json"], + } + } +} +``` + +*建议别名使用 `@/` 开头而非仅用 `@` 开头，因为有小概率会与某些 `scoped` 形式的 `npm` 包（行如：[@tarojs/taro](https://npm.im/@tarojs/taro), [@babel/core](https://npm.im/@babel/core)）产生命名冲突。* + +## copy + +文件 copy 配置，包含两个配置项 `patterns` 和 `options`。 + +### copy.patterns + +用来指定需要拷贝的文件或者目录，**数组类型**，每一项都必须包含 `from` 、`to` 的配置，分别代表来源和需要拷贝到的目录，同时可以设置 `ignore` 配置来指定需要忽略的文件， `ignore` 是指定的 [glob](https://github.com/isaacs/node-glob) 类型字符串，或者 glob 字符串数组。 + +值得注意的是，目前 `from` 必须指定存在的文件或者目录，暂不支持 glob 格式， `from` 和 `to` 直接置顶项目根目录下的文件目录，建议 `from` 以 `src` 目录开头，`to` 以 `dist` 目录开头。 + +一般有如下的使用形式： + +```jsx +copy: { + patterns: [ + { from: 'src/asset/tt/', to: 'dist/asset/tt/', ignore: '*.js' }, // 指定需要 copy 的目录 + { from: 'src/asset/tt/sd.jpg', to: 'dist/asset/tt/sd.jpg' } // 指定需要 copy 的文件 + ] +}, +``` + +### copy.options + +拷贝配置，目前可以指定全局的 ignore： + +```jsx +copy: { + options: { + ignore: ['*.js', '*.css'] // 全局的 ignore + } +} +``` + +## mini + +专属于小程序的配置。 + +### mini.compile + +小程序编译过程的相关配置。 + +#### mini.compile.exclude + +配置小程序编译过程中排除不需要经过 Taro 编译的文件，数组类型，数组里面可以包含具体文件路径，也可以是判断函数，同 [Rule.exclude](https://webpack.js.org/configuration/module/#ruleexclude) + +例如，想要排除某个文件，可以如下配置要排除的文件具体路径： + +```js +const config = { + mini: { + compile: { + exclude: [ + path.resolve(__dirname, '..', 'src/pages/index/vod-wx-sdk-v2.js') + ] + } + } +} +``` + +也可以配置判断函数，如下 + +```js +const config = { + mini: { + compile: { + exclude: [ + function (modulePath) { + return modulePath.indexOf('vod-wx-sdk-v2') >= 0 + } + ] + } + } +} +``` + +#### mini.compile.incldue + +配置额外需要经过 Taro 编译的文件，例如 Taro 默认不编译 `node_modules` 包中文件，可以通过这个配置让 Taro 编译 `node_modules` 包中文件，使用方式与 `mini.compile.exclude` 一致，同 [Rule.include](https://webpack.js.org/configuration/module/#ruleinclude)。 + +### mini.webpackChain + +自定义 Webpack 配置，接受函数形式的配置。 + +这个函数会收到两个参数，第一个参数是 webpackChain 对象，可参考 [webpack-chain](https://github.com/neutrinojs/webpack-chain) 的 api 进行修改；第二个参数是 `webpack` 实例。例如： + +```jsx +// 这是一个添加 raw-loader 的例子，用于在项目中直接引用 md 文件 +{ + webpackChain (chain, webpack) { + chain.merge({ + module: { + rule: { + myloader: { + test: /\.md$/, + use: [{ + loader: 'raw-loader', + options: {} + }] + } + } + } + }) + } +} +``` + +```jsx +// 这是一个添加插件的例子 +{ + webpackChain (chain, webpack) { + chain.merge({ + plugin: { + install: { + plugin: require('npm-install-webpack-plugin'), + args: [{ + // Use --save or --save-dev + dev: false, + // Install missing peerDependencies + peerDependencies: true, + // Reduce amount of console logging + quiet: false, + // npm command used inside company, yarn is not supported yet + npm: 'cnpm' + }] + } + } + }) + } +} +``` + +#### mini.commonChunks + +配置打包时抽离的公共文件，如果是普通编译，则默认值为 `['runtime', 'vendors']`，如果是编译为微信小程序插件，则默认值为 `['plugin/runtime', 'plugin/vendors']`。 + +`commonChunks` 的配置值主要依据 webpack 配置 [`optimization.runtimeChunk`](https://webpack.js.org/configuration/optimization/#optimizationruntimechunk) 和 [`optimization.splitChunks`](https://webpack.js.org/plugins/split-chunks-plugin/)，Taro 中默认的配置分别为 + + +```javascript +optimization: { + runtimeChunk: { + name: 'runtime' + }, + splitChunks: { + chunks: 'all', + maxInitialRequests: Infinity, + minSize: 0, + name: 'vendors', + cacheGroups: { + vendors: { + test (module) { + return /[\\/]node_modules[\\/]/.test(module.resource) && module.miniType !== PARSE_AST_TYPE.COMPONENT + } + } + } + } +} +``` + +如果有自行拆分公共文件的需求，请先通过 `webpackChain` 配置覆盖 `optimization.runtimeChunk` 与 `optimization.splitChunks` 配置，再通过 `commonChunks` 配置指定的公共入口文件。 + +### mini.cssLoaderOption + +css-loader 的附加配置。配置项参考[官方文档](https://github.com/webpack-contrib/css-loader)，例如： + +```jsx +{ + cssLoaderOption: { + localIdentName: '[hash:base64]' + } +} +``` + +### mini.styleLoaderOption + +style-loader 的附加配置。配置项参考[官方文档](https://github.com/webpack-contrib/style-loader)，例如： + +```jsx +{ + styleLoaderOption: { + insertAt: 'top' + } +} +``` + +### mini.sassLoaderOption + +sass-loader 的附加配置。配置项参考[官方文档](https://github.com/webpack-contrib/sass-loader)，例如： + +```jsx +{ + sassLoaderOption: { + implementation: require("dart-sass") + } +} +``` + +### mini.lessLoaderOption + +less-loader 的附加配置。配置项参考[官方文档](https://github.com/webpack-contrib/less-loader)，例如： + +```jsx +{ + lessLoaderOption: { + strictMath: true, + noIeCompat: true + } +} +``` + +### mini.stylusLoaderOption + +stylus-loader 的附加配置。配置项参考[官方文档](https://github.com/shama/stylus-loader)。 + +### mini.mediaUrlLoaderOption + +针对 `mp4 | webm | ogg | mp3 | wav | flac | aac` 文件的 url-loader 配置。配置项参考[官方文档](https://github.com/webpack-contrib/url-loader)，例如： + +```jsx +{ + mediaUrlLoaderOption: { + limit: 8192 + } +} +``` + +### mini.fontUrlLoaderOption + +针对 `woff | woff2 | eot | ttf | otf` 文件的 url-loader 配置。配置项参考[官方文档](https://github.com/webpack-contrib/url-loader)。 + +### mini.imageUrlLoaderOption + +针对 `png | jpg | jpeg | gif | bpm | svg` 文件的 url-loader 配置。配置项参考[官方文档](https://github.com/webpack-contrib/url-loader)。 + +### mini.miniCssExtractPluginOption + +`mini-css-extract-plugin` 的附加配置，在 `enableExtract` 为 `true` 的情况下生效。 +配置项参考[官方文档](https://github.com/webpack-contrib/mini-css-extract-plugin)，例如： + +```jsx +{ + miniCssExtractPluginOption: { + filename: '[name].css', + chunkFilename: '[name].css' + } +} +``` + +### mini.postcss + +配置 `postcss` 相关插件： + +```jsx +postcss: { + // 可以进行 autoprefixer 的配置。配置项参考官方文档 https://github.com/postcss/autoprefixer + autoprefixer: { + enable: true, + config: { + // autoprefixer 配置项 + } + }, + pxtransform: { + enable: true, + config: { + // pxtransform 配置项，参考尺寸章节 + selectorBlackList: ['body'] + } + }, + // 小程序端样式引用本地资源内联 + url: { + enable: true, + config: { + limit: 10240 // 设定转换尺寸上限 + } + }, + // css modules 功能开关与相关配置 + cssModules: { + enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true + config: { + generateScopedName: '[name]__[local]___[hash:base64:5]' + } + } +} +``` + +## h5 + +专属于 H5 的配置。 + +### h5.devServer + +预览服务的配置，可以更改端口等参数。具体配置参考 [webpack-dev-server](https://webpack.js.org/configuration/dev-server)。 + +```js +devServer: { + port: 10086 +} +``` + +默认是 `http` 服务，如果想开启 `https` 服务需要做如下配置。 + +```js +devServer: { + https: true +} +``` + +### h5.output + +输出配置 + +```js +output: { + filename: 'js/[name].[hash:8].js', + chunkFilename: 'js/[name].[chunkhash:8].js' +} +``` + +### h5.publicPath + +设置输出解析文件的目录。 + +### h5.staticDirectory + +h5 编译后的静态文件目录。 + +### h5.chunkDirectory + +编译后非 entry 的 js 文件的存放目录，主要影响动态引入的 `pages` 的存放路径。 + +### h5.webpackChain + +自定义 Webpack 配置，接受函数形式的配置。 + +这个函数会收到两个参数，第一个参数是 webpackChain 对象，可参考 [webpack-chain](https://github.com/neutrinojs/webpack-chain) 的 api 进行修改；第二个参数是 `webpack` 实例。例如： + +```jsx +// 这是一个添加 ts-loader 的例子，但事实上 taro 是默认支持 ts 的，并不需要这样做。 +{ + webpackChain (chain, webpack) { + chain.merge({ + module: { + rule: { + myloader: { + test: /.tsx?/, + use: [{ + loader: 'ts-loader', + options: {} + }] + } + } + } + }) + } +} +``` + +```jsx +// 这是一个添加插件的例子 +{ + webpackChain (chain, webpack) { + chain.merge({ + plugin: { + install: { + plugin: require('npm-install-webpack-plugin'), + args: [{ + // Use --save or --save-dev + dev: false, + // Install missing peerDependencies + peerDependencies: true, + // Reduce amount of console logging + quiet: false, + // npm command used inside company, yarn is not supported yet + npm: 'cnpm' + }] + } + } + }) + } +} +``` + +### h5.router + +路由相关的配置，支持路由模式、路由基准路径以及自定义路由的配置。 + +#### h5.router.mode + +路由模式配置。配置值为 `hash`（默认值）或 `browser`，分别对应 hash 路由模式和浏览器 history 路由模式。例子： + +```js +h5: { + /* 其他配置 */ + ... , + router: { + mode: 'hash' // 或者是 'browser' + } +} +``` + +针对上面的配置，调用 `Taro.navigateTo({ url: '/pages/index/index' })` 后，浏览器地址栏将被变为 `http://{{domain}}/#/pages/index/index`（hash 模式）或者 `http://{{domain}}/pages/index/index`（browser 模式）。 + +#### h5.router.basename + +路由基准路径的配置，配置值为 `string` 类型。例子： + +```js +h5: { + /* 其他配置 */ + ... , + router: { + basename: '/myapp' + } +} +``` + +针对上面的配置，调用 `Taro.navigateTo({ url: '/pages/index/index' })` 后，浏览器地址栏将被变为 `http://{{domain}}/#/myapp/pages/index/index`（hash 模式）或者 `http://{{domain}}/myapp/pages/index/index`（browser 模式）。 + +#### h5.router.customRoutes + +自定义路由的配置，配置值为 `{ [key: string]: string }` 类型。例子： + +```js +h5: { + /* 其他配置 */ + ... , + router: { + customRoutes: { + '/pages/index/index': '/index' + } + } +} +``` + +针对上面的配置，调用 `Taro.navigateTo({ url: '/pages/index/index' })` 后，浏览器地址栏将被变为 `http://{{domain}}/#/index`（hash 模式）或者 `http://{{domain}}/myapp/index`（browser 模式）。 + +### h5.entry + +Taro app 的入口，同 [webpack.entry](https://webpack.js.org/configuration/entry-context/#entry)。 + +```jsx +{ + entry: { + home: ['./home.js'], + about: ['./about.js'], + contact: ['./contact.js'] + } +} +``` + +### h5.enableSourceMap + +sourceMap 开关，影响 js、css 的 sourceMap 配置。 +dev 状态默认 **开**，prod 状态默认 **关**。 + +### h5.sourceMapType +sourceMap格式, 默认cheap-module-eval-source-map。[具体配置](https://webpack.js.org/configuration/devtool/#devtool) + +### h5.enableDll + +dll 开关，开启后将使用 `dllPlugin` 把内置的部分依赖库打包为单独的 dll 文件， +某种程度上可以减少首屏单个文件体积。 +dev 状态默认 **关**，prod 状态默认 **开**。 + +### h5.dllWebpackChain + +同 `h5.webpackChain`，不过作用于 dll。 + +### h5.dllEntry + +dll编译过程的 `entry` 配置项，决定了 dll 文件的内容，可参考 [webpack.entry](https://webpack.js.org/configuration/entry-context/#entry)。默认值： + +```js +h5: { + /* 其他配置 */ + ..., + dllEntry: { + lib: ['nervjs', '@tarojs/taro-h5', '@tarojs/router', '@tarojs/components'] + } +} +``` + +### h5.enableExtract + +extract 功能开关，开启后将使用 `mini-css-extract-plugin` 分离 css 文件， +可通过 `h5.miniCssExtractPluginOption` 对插件进行配置。 +dev 状态默认 **关**，prod 状态默认 **开**。 + +### h5.esnextModules + +配置需要额外的编译的源码模块，比如 [taro-ui](https://github.com/NervJS/taro-ui)： + +```javascript +h5: { + // 经过这一配置之后，代码中引入的处于 `node_modules/taro-ui/` 路径下的源码文件均会经过taro的编译处理。 + esnextModules: ['taro-ui'], + ... +} +``` + +### h5.cssLoaderOption + +css-loader 的附加配置。配置项参考[官方文档](https://github.com/webpack-contrib/css-loader)，例如： + +```jsx +{ + cssLoaderOption: { + localIdentName: '[hash:base64]' + } +} +``` + +### h5.styleLoaderOption + +style-loader 的附加配置。配置项参考[官方文档](https://github.com/webpack-contrib/style-loader)，例如： + +```jsx +{ + styleLoaderOption: { + insertAt: 'top' + } +} +``` + +### h5.sassLoaderOption + +sass-loader 的附加配置。配置项参考[官方文档](https://github.com/webpack-contrib/sass-loader)，例如： + +```jsx +{ + sassLoaderOption: { + implementation: require("dart-sass") + } +} +``` + +### h5.lessLoaderOption + +less-loader 的附加配置。配置项参考[官方文档](https://github.com/webpack-contrib/less-loader)，例如： + +```jsx +{ + lessLoaderOption: { + strictMath: true, + noIeCompat: true + } +} +``` + +### h5.stylusLoaderOption + +stylus-loader 的附加配置。配置项参考[官方文档](https://github.com/shama/stylus-loader)。 + +### h5.mediaUrlLoaderOption + +针对 `mp4 | webm | ogg | mp3 | wav | flac | aac` 文件的 url-loader 配置。配置项参考[官方文档](https://github.com/webpack-contrib/url-loader)，例如： + +```jsx +{ + mediaUrlLoaderOption: { + limit: 8192 + } +} +``` + +### h5.fontUrlLoaderOption + +针对 `woff | woff2 | eot | ttf | otf` 文件的 url-loader 配置。配置项参考[官方文档](https://github.com/webpack-contrib/url-loader)。 + +### h5.imageUrlLoaderOption + +针对 `png | jpg | jpeg | gif | bpm | svg` 文件的 url-loader 配置。配置项参考[官方文档](https://github.com/webpack-contrib/url-loader)。 + +### h5.miniCssExtractPluginOption + +`mini-css-extract-plugin` 的附加配置，在 `enableExtract` 为 `true` 的情况下生效。 +配置项参考[官方文档](https://github.com/webpack-contrib/mini-css-extract-plugin)，例如： + +```jsx +{ + miniCssExtractPluginOption: { + filename: 'css/[name].css', + chunkFilename: 'css/[id].css' + } +} +``` + +### h5.postcss + +配置 H5 的 `postcss` 插件。 + +#### h5.postcss.autoprefixer + +可以进行 `autoprefixer` 的配置。配置项参考[官方文档](https://github.com/postcss/autoprefixer)，例如： + +```jsx +postcss: { + autoprefixer: { + enable: true, + config: { + /* autoprefixer 配置项 */ + } + } +} +``` + +#### h5.postcss.pxtransform + +可以进行 `pxtransform` 的配置。配置项参考[官方文档](https://github.com/Pines-Cheng/postcss-pxtransform/)，例如： + +```jsx +postcss: { + pxtransform: { + enable: true, + config: { + /* pxtransform 配置项 */ + } + } +} +``` + +#### h5.postcss.cssModules + +可以进行 H5 端 CSS Modules 配置，配置如下： + +```js +postcss: { + // css modules 功能开关与相关配置 + cssModules: { + enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true + config: { + namingPattern: 'module', + generateScopedName: '[name]__[local]___[hash:base64:5]' + } + } +} +``` diff --git a/website/versioned_docs/version-2.0.1/css-modules.md b/website/versioned_docs/version-2.0.1/css-modules.md new file mode 100644 index 000000000000..6aadad26e415 --- /dev/null +++ b/website/versioned_docs/version-2.0.1/css-modules.md @@ -0,0 +1,93 @@ +--- +title: 使用 CSS Modules +id: version-2.0.1-css-modules +original_id: css-modules +--- + +> 1.2.0 版本开始支持，RN 端已兼容 + +Taro 中内置了 [CSS Modules](https://github.com/css-modules/css-modules) 的支持，但默认是关闭的，如果需要开启使用，请先在[编译配置](./config-detail.md)中添加如下配置。 + +小程序端开启 + +```js +mini: { + postcss: { + // css modules 功能开关与相关配置 + cssModules: { + enable: true, // 默认为 false，如需使用 css modules 功能，则设为 true + config: { + namingPattern: 'module', // 转换模式，取值为 global/module，下文详细说明 + generateScopedName: '[name]__[local]___[hash:base64:5]' + } + } + } +} +``` + +H5 端开启 + +```js +h5: { + postcss: { + // css modules 功能开关与相关配置 + cssModules: { + enable: true, // 默认为 false，如需使用 css modules 功能，则设为 true + config: { + namingPattern: 'module', // 转换模式，取值为 global/module，下文详细说明 + generateScopedName: '[name]__[local]___[hash:base64:5]' + } + } + } +} +``` + +在开启之后，你就可以在 Taro 中使用 CSS Modules 功能了，值得注意的是，Taro 中使用 CSS Modules 有两种模式，分别为全局转换及部分自定义转换模式，通过 `namingPattern` 配置进行控制 + +`namingPattern` 配置取值分别如下： +- `global`，表示全局转换，所有样式文件都会经过 CSS Modules 转换处理，除了文件名中包含 `.global.` 的样式文件 +- `module`，表示自定义转换，只有文件名中包含 `.module.` 的样式文件会经过 CSS Modules 转换处理 + +`generateScopedName` 支持传入字符串和函数： + +- `字符串`，其格式见：[https://github.com/webpack/loader-utils#interpolatename](https://github.com/webpack/loader-utils#interpolatename)，值得指出的是，可使用 `[local]` 取其原类名 +- `函数`，其类型定义为 `(localName: string, absoluteFilePath: string) => string`，其中 `localName` 为原类名，`absoluteFilePath` 为文件的绝对路径，返回值将作为新的类名 + +**推荐使用自定义转换模式，这样的话就不会影响到一些第三方库的样式了** + +CSS Modules 使用方式如下 + +组件样式 + +```scss +.test { + color: red; + .txt { + font-size: 36px; + } +} +``` + +组件 JS 中使用样式 + +```jsx +import Taro, { Component } from '@tarojs/taro' +import { View, Text } from '@tarojs/components' + +import styles from './Test.module.scss' + +export default class Test extends Component { + constructor(props) { + super(props) + this.state = { } + } + + render () { + return ( + + Hello world! + + ) + } +} +``` diff --git a/website/versioned_docs/version-2.0.1/migrate-to-2.md b/website/versioned_docs/version-2.0.1/migrate-to-2.md new file mode 100644 index 000000000000..3f5b49621289 --- /dev/null +++ b/website/versioned_docs/version-2.0.1/migrate-to-2.md @@ -0,0 +1,196 @@ +--- +title: 迁移至 Taro 2.x +id: version-2.0.1-migrate-to-2 +original_id: migrate-to-2 +--- + +Taro 2.0 整体上与 1.0 是完全兼容的，迁移并不困难，本指南将指导你如何进行从 Taro 1.x 到 Taro 2.x 的迁移工作。 + +## 更新 Taro CLI 和依赖版本 + +你可以根据自己的实际情况选择升级全局的 Taro 版本或者仅为你的某一个项目升级。 + +### 全局 CLI 升级 + +如果你的 Taro CLI 以全局方式安装，并且你希望升级到 Taro 2.0 需要执行以下命令： + +```bash +# 使用 Taro 自己 + +$ taro update self 2.0.0 + +# 如果你使用 MPM + +$ npm update -g @tarojs/cli@2.0.0 + +# 如果你使用 Yarn + +$ yarn global upgrade @tarojs/cli@2.0.0 +``` + +之后在你的项目目录里运行以下命令来升级依赖： + +```bash +$ taro update project 2.0.0 +``` + +### 单独为某一个项目升级 + +这样做的好处是全局的 Taro 版本还是 1.x 的，多个项目间的依赖不冲突，其余项目依然可以用旧版本开发。 +如果你的项目里没有安装 Taro CLI，你需要先装一个： + +```bash +# 如果你使用 NPM + +$ npm install --save-dev @tarojs/cli@2.0.0 + +# 如果你使用 Yarn + +$ yarn add -D @tarojs/cli@2.0.0 +``` + +然后在你的项目目录里运行以下命令来升级依赖： + +```bash +# 如果你使用 NPM + +$ node ./node_modules/.bin/taro update project 2.0.0 + +# 如果你使用 Yarn + +$ yarn taro update project 2.0.0 +``` + +## 安装 `@tarojs/mini-runner` 依赖 + +Taro 2.0 新增了 `@tarojs/mini-runner` 作为小程序的编译依赖，所以你需要将它安装在你的项目里，运行： + +```bash +# 如果你使用 NPM + +$ npm install --save-dev @tarojs/mini-runner@2.0.0 + +# 如果你使用 Yarn + +$ yarn add -D @tarojs/mini-runner@2.0.0 +``` + +## 编译配置调整 + +Taro 2.0 对 CLI 的编译构建系统进行了重构，使用 Webpack 来实现编译构建，所以我们对部分编译配置做了优化调整。 + +```js +const config = { + projectName: 'taro-framework', + date: '2019-11-2', + designWidth: 750, + deviceRatio: { + 640: 2.34 / 2, + 750: 1, + 828: 1.81 / 2 + }, + sourceRoot: 'src', + outputRoot: 'dist', + // babel、csso、uglify 等配置从 plugins 配置中移出来 + babel: { + sourceMap: true, + presets: [['env', { modules: false }]],, + plugins: [ + 'transform-decorators-legacy', + 'transform-class-properties', + 'transform-object-rest-spread' + ] + }, + // 小程序配置从 weapp 改为 mini，可以删掉很多小配置 + mini: { + webpackChain (chain, webpack) {}, + cssLoaderOption: {}, + postcss: { + pxtransform: { + enable: true, + config: {} + }, + url: { + enable: true, + config: { + limit: 10240 // 设定转换尺寸上限 + } + } + } + }, + // 可以删掉很多小配置 + h5: { + publicPath: '/', + staticDirectory: 'static', + webpackChain (chain, webpack) {}, + postcss: { + autoprefixer: { + enable: true, + config: { + browsers: [ + 'last 3 versions', + 'Android >= 4.1', + 'ios >= 8' + ] + } + } + } + } +} + +module.exports = function (merge) { + if (process.env.NODE_ENV === 'development') { + return merge({}, config, require('./dev')) + } + return merge({}, config, require('./prod')) +} +``` + +具体编译配置请参考 [编译配置文档](config-detail.md)。 + +## 异步编程调整 + +Taro 2.0 中开启 `async functions` 支持不再需要安装 `@tarojs/async-await`，而是直接通过 babel 插件来获得支持。 + +在项目根目录下安装包 `babel-plugin-transform-runtime` 和 `babel-runtime`。 + +```bash +# 如果你使用 NPM + +$ npm install --save-dev babel-plugin-transform-runtime +$ npm install --save babel-runtime + +# 如果你使用 Yarn + +$ yarn add -D babel-plugin-transform-runtime +$ yarn add babel-runtime +``` + +随后修改项目 [babel 配置](https://nervjs.github.io/taro/docs/config-detail.html#babel)，配置插件 `babel-plugin-transform-runtime`。 + +```js +babel: { + sourceMap: true, + presets: [['env', { modules: false }]], + plugins: [ + 'transform-decorators-legacy', + 'transform-class-properties', + 'transform-object-rest-spread', + ['transform-runtime', { + "helpers": false, + "polyfill": false, + "regenerator": true, + "moduleName": 'babel-runtime' + }] + ] +} +``` + +#### 注意：Taro RN 依赖升级到 0.59.9 + +在 2.0 中我们将 RN 端 React 依赖升级到 16.8.0，React Native 依赖升级到 0.59.9。主要原因： + +- Google 要求所有 [Google Play](https://play.google.com/) 应用支持 64 位 so 库，而现有 RN 0.55.4 依无法支持 64 位库，为配合 64 位升级，Taro RN 端的 React Native 依赖需要同步升级 +- React 16.8.0 是第一个支持 Hook 的版本，React Native 从 0.59 版本开始支持 Hook，此前社区一直在呼吁对 RN 0.55.4 进行升级以直接支持 Hook 的写法 + +本次 RN 端属于无缝升级，原有的写法和配置均不变，如果使用 [taro-native-shell](https://github.com/NervJS/taro-native-shell) 的，选择 0.59.9 分支即可；在原生应用集成 RN 的，需要自行升级 React Native 依赖到 0.59.9。 diff --git a/website/versioned_docs/version-2.0.1/size.md b/website/versioned_docs/version-2.0.1/size.md new file mode 100644 index 000000000000..eb717da1c198 --- /dev/null +++ b/website/versioned_docs/version-2.0.1/size.md @@ -0,0 +1,168 @@ +--- +title: 设计稿及尺寸单位 +id: version-2.0.1-size +original_id: size +--- + +在 Taro 中尺寸单位建议使用 `px`、 `百分比 %`，Taro 默认会对所有单位进行转换。在 Taro 中书写尺寸按照 1:1 的关系来进行书写，即从设计稿上量的长度 `100px`，那么尺寸书写就是 `100px`，当转成微信小程序的时候，尺寸将默认转换为 `100rpx`，当转成 H5 时将默认转换为以 `rem` 为单位的值。 + +如果你希望部分 `px` 单位不被转换成 `rpx` 或者 `rem` ，最简单的做法就是在 px 单位中增加一个大写字母，例如 `Px` 或者 `PX` 这样，则会被转换插件忽略。 + +结合过往的开发经验，Taro 默认以 `750px` 作为换算尺寸标准，如果设计稿不是以 `750px` 为标准，则需要在项目配置 `config/index.js` 中进行设置，例如设计稿尺寸是 `640px`，则需要修改项目配置 `config/index.js` 中的 `designWidth` 配置为 `640`： + +```jsx +const config = { + projectName: 'myProject', + date: '2018-4-18', + designWidth: 640, + .... +} +``` + +目前 Taro 支持 `750`、 `640` 、 `828` 三种尺寸设计稿，他们的换算规则如下： + +```jsx +const deviceRatio = { + '640': 2.34 / 2, + '750': 1, + '828': 1.81 / 2 +} +``` + +建议使用 Taro 时，设计稿以 iPhone 6 `750px` 作为设计尺寸标准。 + +如果你的设计稿是 `375` ，不在以上三种之中，那么你需要把 `designWidth` 配置为 `375`，同时在 `deviceRatio` 中添加换算规则如下： +```js +{ + designWidth: 375, + deviceRatio: { + '375': 1 / 2, + '640': 2.34 / 2, + '750': 1, + '828': 1.81 / 2 + } +} +``` + +## API + +在编译时，Taro 会帮你对样式做尺寸转换操作，但是如果是在 JS 中书写了行内样式，那么编译时就无法做替换了，针对这种情况，Taro 提供了 API `Taro.pxTransform` 来做运行时的尺寸转换。 + +```jsx +Taro.pxTransform(10) // 小程序：rpx，H5：rem +``` + +## 配置 + +默认配置会对所有的 `px` 单位进行转换，有大写字母的 `Px` 或 `PX` 则会被忽略。 + +参数默认值如下： + +```js +{ + onePxTransform: true, + unitPrecision: 5, + propList: ['*'], + selectorBlackList: [], + replace: true, + mediaQuery: false, + minPixelValue: 0 +} +``` + +Type: `Object | Null` + +### `onePxTransform` (Boolean) + +设置 1px 是否需要被转换 + +### `unitPrecision` (Number) + +REM 单位允许的小数位。 + +### `propList` (Array) + +允许转换的属性。 + +- Values need to be exact matches. +- Use wildcard `*` to enable all properties. Example: `['*']` +- Use `*` at the start or end of a word. (`['*position*']` will match `background-position-y`) +- Use `!` to not match a property. Example: `['*', '!letter-spacing']` +- Combine the "not" prefix with the other prefixes. Example: `['*', '!font*']` + +### `selectorBlackList` + +黑名单里的选择器将会被忽略。 + +- If value is string, it checks to see if selector contains the string. + - `['body']` will match `.body-class` +- If value is regexp, it checks to see if the selector matches the regexp. + - `[/^body$/]` will match `body` but not `.body` + +### `replace` (Boolean) + +直接替换而不是追加一条进行覆盖。 + +### `mediaQuery` (Boolean) + +允许媒体查询里的 px 单位转换 + +### `minPixelValue` (Number) + +设置一个可被转换的最小 px 值 + +配置规则对应到 `config/index.js` ，例如： + +```js +{ + h5: { + publicPath: '/', + staticDirectory: 'static', + postcss: { + autoprefixer: { + enable: true + }, + pxtransform: { + enable: true, + config: { + selectorBlackList: ['body'] + } + } + } + }, + mini: { + // ... + postcss: { + pxtransform: { + enable: true, + config: { + selectorBlackList: ['body'] + } + } + } + } +} +``` + +## 忽略 + +### 属性 + +当前忽略单个属性的最简单的方法，就是 px 单位使用大写字母。 + +```css + /* `px` is converted to `rem` */ +.convert { + font-size: 16px; // converted to 1rem +} + + /* `Px` or `PX` is ignored by `postcss-pxtorem` but still accepted by browsers */ +.ignore { + border: 1Px solid; // ignored + border-width: 2PX; // ignored +} +``` + +### 文件 + +对于头部包含注释 `/*postcss-pxtransform disable*/` 的文件，插件不予处理。 diff --git a/website/versioned_docs/version-2.0.1/static-reference.md b/website/versioned_docs/version-2.0.1/static-reference.md new file mode 100644 index 000000000000..0945563da627 --- /dev/null +++ b/website/versioned_docs/version-2.0.1/static-reference.md @@ -0,0 +1,83 @@ +--- +title: 静态资源引用 +id: version-2.0.1-static-reference +original_id: static-reference +--- + +在 Taro 中可以像使用 [Webpack](https://webpack.js.org/) 那样自由地引用静态资源，而且不需要安装任何 Loaders。 + +## 引用样式文件 + +可以直接通过 ES6 的 `import` 语法来引用样式文件 + +例如引用 CSS 文件 + +```jsx +import './css/path/name.css' +``` + +引用 SCSS 文件 + +```jsx +import './css/path/name.scss' +``` + +## 引用 JS 文件 + +可以直接通过 ES6 的 `import` 语法来引用 JS 文件 + +```jsx +import { functionName } from './css/path/name.js' + +import defaultExportName from './css/path/name.js' +``` + +## 引用图片、音频、字体等文件 + +可以直接通过 ES6 的 `import` 语法来引用此类文件，拿到文件引用后直接在 JSX 中进行使用 + +```jsx + +// 引用文件 +import namedPng from '../../images/path/named.png' + +// 使用 + + + +``` + +## 引用 JSON 文件 + +可以直接通过 ES6 的 `import` 语法来引用此类文件，拿到 JSON 文件输出的 JSON 数据 + +```jsx +// 引用 json 文件 +/** +* named.json +* { +* x: 1 +* } +**/ +import namedJson from '../../json/path/named.json' + +console.log(namedJson.x) +``` + +## 小程序样式中引用本地资源 + +在小程序的样式中，默认不能直接引用本地资源，只能通过网络地址、Base64 的方式来进行资源引用，为了方便开发，Taro 提供了直接在样式文件中引用本地资源的方式，其原理是通过 `PostCSS` 的 [`postcss-url`](https://github.com/postcss/postcss-url) 插件将样式中本地资源引用转换成 Base64 格式，从而能正常加载。 + +Taro 默认会对 `10kb` 大小以下的资源进行转换，如果需要修改配置，可以在 `config/index.js` 中进行修改，配置位于 [`mini.postcss`](./config-detail.html#minipostcss)。 + +具体配置如下 + +```javascript +// 小程序端样式引用本地资源内联 +url: { + enable: true, + config: { + limit: 10240 // 设定转换尺寸上限 + } +} +``` diff --git a/website/versioned_docs/version-2.0.1/ui-lib.md b/website/versioned_docs/version-2.0.1/ui-lib.md new file mode 100644 index 000000000000..8887b91a6bcb --- /dev/null +++ b/website/versioned_docs/version-2.0.1/ui-lib.md @@ -0,0 +1,125 @@ +--- +title: 基于 Taro 开发第三方多端 UI 库 +id: version-2.0.1-ui-lib +original_id: ui-lib +--- + +> 通过 Taro 提供的多端 UI 库打包能力，可以打包出一个多端运行的 UI 库，目前已经支持 微信/支付宝/百度小程序以及 H5，RN 端。示例项目 [taro-ui-sample](https://github.com/NervJS/taro-ui-sample) + +## 多端 UI 库项目结构 + +多端 UI 库的项目目录结构与普通 Taro 项目基本一致，不同点如下 + +#### 增加一个 UI 库入口文件 +> RN 端 `index.js` 已经被占用，如果要兼容 RN 端，需改为其他名字，并通过 `--ui-index`指定入口文件。 + +需要在 `src` 目录下添加 `index.js` 或者 `index.ts` 来作为 UI 库的入口文件，用于输出 UI 组件，如果有多个 UI 组件，可以如下书写 + +```javascript +export { default as A } from './components/A/A' +export { default as B } from './components/B/B' +``` + +这样的话，这个组件库使用起来，会是如下的方式 + +```javascript +import { A } from 'taro-ui-sample' + + +``` + +如果只有 UI 组件，也可以如下书写 + +```javascript +import A from './components/A/A' + +export default A +``` + +这样的话，这个组件库使用起来，会是如下的方式 + +```javascript +import A from 'taro-ui-sample' + + +``` + +#### 配置文件改造 + +为了打包出可以在 H5 端使用的组件库，需要在 `config/index.js` 文件中增加一些配置 + +```javascript +if (process.env.TARO_BUILD_TYPE === 'ui') { + Object.assign(config.h5, { + enableSourceMap: false, + enableExtract: false, + enableDll: false + }) + config.h5.webpackChain = chain => { + chain.plugins.delete('htmlWebpackPlugin') + chain.plugins.delete('addAssetHtmlWebpackPlugin') + chain.merge({ + output: { + path: path.join(process.cwd(), 'dist', 'h5'), + filename: 'index.js', + libraryTarget: 'umd', + library: 'taro-ui-sample' + }, + externals: { + nervjs: 'commonjs2 nervjs', + classnames: 'commonjs2 classnames', + '@tarojs/components': 'commonjs2 @tarojs/components', + '@tarojs/taro-h5': 'commonjs2 @tarojs/taro-h5', + 'weui': 'commonjs2 weui' + } + }) + } +} +``` + +以上配置可以根据需要自行修改。 + +## 打包命令 + +在完成以上项目结构改造后，你就可以获得一个 Taro 的多端 UI 库的项目了 + +这时候你可以通过如下命令来进行打包 + +```bash +$ TARO_BUILD_TYPE=ui taro build --ui --ui-index=${CUSTOM_ENTRY} +``` +只有当 UI 库入口文件非 `index.js` 时，才需要通过 `--ui-index`指定入口文件，其中 `CUSTOM_ENTRY` 为自定义的 UI 库入口文件。 + +打包之后的文件在 `dist` 目录下 + +里面会包含一个 `index.js` 的入口文件，内容如下，需要注意的是，这个内容是 Taro 自动生成的，不可修改 + +```javascript +if (process.env.TARO_ENV === 'h5') { + module.exports = require('./h5/index') + module.exports.default = module.exports +} else { + module.exports = require('./weapp/index') + module.exports.default = module.exports +} +``` + +H5 端以及小程序类（微信/支付宝/百度）的文件分别在 `h5` 和 `weapp` 目录下，通过入口文件就能在不同的端内进行引用 + +## 项目测试 + +推荐采用 [Jest](https://jestjs.io/) 进行测试，项目中已经包含了完整的测试配置与范例，可以直接使用，有以下值得注意的地方 + +#### 使用 babel-jest + +转换器使用 `babel-jest`，为了配合 babel 7 进行使用，需要安装 + +```bash +$ yarn add --dev babel-jest babel-core@^7.0.0-bridge.0 @babel/core +``` + +其中 `babel-core@^7.0.0-bridge.0` 一定要安装 + +#### babel.config.js + +由于测试使用了 babel 7，为了避免和 Taro 本身使用的 babel 冲突，测试使用的 babel 配置位于 `babel.config.js` 中 diff --git a/website/versioned_sidebars/version-2.0.1-sidebars.json b/website/versioned_sidebars/version-2.0.1-sidebars.json new file mode 100644 index 000000000000..4be652734065 --- /dev/null +++ b/website/versioned_sidebars/version-2.0.1-sidebars.json @@ -0,0 +1,641 @@ +{ + "version-2.0.1-docs": { + "关于Taro": [ + "version-2.0.1-README", + "version-2.0.1-taroize", + "version-2.0.1-team" + ], + "快速开始": [ + "version-2.0.1-GETTING-STARTED", + "version-2.0.1-composition", + "version-2.0.1-before-dev-remind", + "version-2.0.1-specials" + ], + "基础教程": [ + "version-2.0.1-spec-for-taro", + "version-2.0.1-tutorial", + "version-2.0.1-project-config", + "version-2.0.1-best-practice", + "version-2.0.1-router", + "version-2.0.1-size", + "version-2.0.1-static-reference", + "version-2.0.1-component-style", + { + "label": "语法特性", + "type": "subcategory", + "ids": [ + "version-2.0.1-jsx", + "version-2.0.1-props", + "version-2.0.1-state", + "version-2.0.1-event", + "version-2.0.1-condition", + "version-2.0.1-list", + "version-2.0.1-functional-component", + "version-2.0.1-context", + "version-2.0.1-children", + "version-2.0.1-render-props", + "version-2.0.1-ref" + ] + }, + { + "label": "多端开发", + "type": "subcategory", + "ids": [ + "version-2.0.1-envs", + "version-2.0.1-envs-debug", + "version-2.0.1-relations", + "version-2.0.1-wxcloud", + "version-2.0.1-miniprogram-plugin", + "version-2.0.1-quick-app", + "version-2.0.1-react-native" + ] + }, + "version-2.0.1-debug" + ], + "进阶指南": [ + "version-2.0.1-config", + "version-2.0.1-config-detail", + "version-2.0.1-debug-config", + "version-2.0.1-hooks", + "version-2.0.1-ui-lib", + "version-2.0.1-async-await", + "version-2.0.1-mini-third-party", + "version-2.0.1-hybrid", + "version-2.0.1-optimized-practice" + ], + "迁移指南": [ + "version-2.0.1-migrate-to-2" + ], + "社区生态": [ + "version-2.0.1-redux", + "version-2.0.1-mobx", + "version-2.0.1-css-modules", + "version-2.0.1-template", + "version-2.0.1-report", + "version-2.0.1-join-in", + "version-2.0.1-CONTRIBUTING" + ] + }, + "version-2.0.1-components": { + "关于组件库": [ + "version-2.0.1-components-desc" + ], + "视图容器": [ + "version-2.0.1-components/viewContainer/view", + "version-2.0.1-components/viewContainer/scroll-view", + "version-2.0.1-components/viewContainer/swiper", + "version-2.0.1-components/viewContainer/movable-view", + "version-2.0.1-components/viewContainer/cover-view" + ], + "基础内容": [ + "version-2.0.1-components/base/icon", + "version-2.0.1-components/base/text", + "version-2.0.1-components/base/progress", + "version-2.0.1-components/base/rich-text" + ], + "表单组件": [ + "version-2.0.1-components/forms/button", + "version-2.0.1-components/forms/checkbox", + "version-2.0.1-components/forms/form", + "version-2.0.1-components/forms/input", + "version-2.0.1-components/forms/label", + "version-2.0.1-components/forms/picker", + "version-2.0.1-components/forms/picker-view", + "version-2.0.1-components/forms/radio", + "version-2.0.1-components/forms/slider", + "version-2.0.1-components/forms/switch", + "version-2.0.1-components/forms/textarea" + ], + "导航": [ + "version-2.0.1-components/navig/navigator" + ], + "媒体组件": [ + "version-2.0.1-components/media/audio", + "version-2.0.1-components/media/image", + "version-2.0.1-components/media/video", + "version-2.0.1-components/media/camera" + ], + "地图": [ + "version-2.0.1-components/maps/map" + ], + "画布": [ + "version-2.0.1-components/canvas/canvas" + ], + "开放能力": [ + "version-2.0.1-components/open/ad", + "version-2.0.1-components/open/official-account", + "version-2.0.1-components/open/open-data", + "version-2.0.1-components/open/web-view", + "version-2.0.1-components/open/others" + ] + }, + "version-2.0.1-API": { + "关于API": [ + "version-2.0.1-apis/about/desc", + "version-2.0.1-apis/about/tarocomponent", + "version-2.0.1-apis/about/env", + "version-2.0.1-apis/about/events" + ], + "设备": [ + { + "label": "加速度计", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/accelerometer/startAccelerometer", + "version-2.0.1-apis/device/accelerometer/stopAccelerometer", + "version-2.0.1-apis/device/accelerometer/onAccelerometerChange" + ] + }, + { + "label": "设备方向", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/deviceMotion/startDeviceMotionListening", + "version-2.0.1-apis/device/deviceMotion/stopDeviceMotionListening", + "version-2.0.1-apis/device/deviceMotion/onDeviceMotionChange" + ] + }, + { + "label": "蓝牙", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/bluetooth/closeBluetoothAdapter", + "version-2.0.1-apis/device/bluetooth/getBluetoothAdapterState", + "version-2.0.1-apis/device/bluetooth/getBluetoothDevices", + "version-2.0.1-apis/device/bluetooth/getConnectedBluetoothDevices", + "version-2.0.1-apis/device/bluetooth/onBluetoothAdapterStateChange", + "version-2.0.1-apis/device/bluetooth/onBluetoothDeviceFound", + "version-2.0.1-apis/device/bluetooth/openBluetoothAdapter", + "version-2.0.1-apis/device/bluetooth/startBluetoothDevicesDiscovery", + "version-2.0.1-apis/device/bluetooth/stopBluetoothDevicesDiscovery" + ] + }, + { + "label": "低功耗蓝牙", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/ble/closeBLEConnection", + "version-2.0.1-apis/device/ble/createBLEConnection", + "version-2.0.1-apis/device/ble/getBLEDeviceCharacteristics", + "version-2.0.1-apis/device/ble/getBLEDeviceServices", + "version-2.0.1-apis/device/ble/notifyBLECharacteristicValueChange", + "version-2.0.1-apis/device/ble/onBLECharacteristicValueChange", + "version-2.0.1-apis/device/ble/onBLEConnectionStateChange", + "version-2.0.1-apis/device/ble/readBLECharacteristicValue", + "version-2.0.1-apis/device/ble/writeBLECharacteristicValue" + ] + }, + { + "label": "亮度", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/brightness/getScreenBrightness", + "version-2.0.1-apis/device/brightness/setKeepScreenOn", + "version-2.0.1-apis/device/brightness/setScreenBrightness" + ] + }, + { + "label": "剪贴板", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/clipboard/getClipboardData", + "version-2.0.1-apis/device/clipboard/setClipboardData" + ] + }, + { + "label": "罗盘", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/compass/onCompassChange", + "version-2.0.1-apis/device/compass/startCompass", + "version-2.0.1-apis/device/compass/stopCompass" + ] + }, + { + "label": "联系人", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/contacts/addPhoneContact" + ] + }, + { + "label": "iBeacon", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/ibeacon/getBeacons", + "version-2.0.1-apis/device/ibeacon/onBeaconServiceChange", + "version-2.0.1-apis/device/ibeacon/onBeaconUpdate", + "version-2.0.1-apis/device/ibeacon/startBeaconDiscovery", + "version-2.0.1-apis/device/ibeacon/stopBeaconDiscovery" + ] + }, + { + "label": "网络", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/netstat/getNetworkType", + "version-2.0.1-apis/device/netstat/onNetworkStatusChange" + ] + }, + { + "label": "NFC", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/nfc/getHCEState", + "version-2.0.1-apis/device/nfc/onHCEMessage", + "version-2.0.1-apis/device/nfc/sendHCEMessage", + "version-2.0.1-apis/device/nfc/startHCE", + "version-2.0.1-apis/device/nfc/stopHCE" + ] + }, + { + "label": "电话", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/phone/makePhoneCall" + ] + }, + { + "label": "扫码", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/scancode/scancode" + ] + }, + { + "label": "屏幕", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/screenshot/onUserCaptureScreen" + ] + }, + { + "label": "振动", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/vibrate/vibrateLong", + "version-2.0.1-apis/device/vibrate/vibrateShort" + ] + }, + { + "label": "系统信息", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/systeminfo/canIUse", + "version-2.0.1-apis/device/systeminfo/getSystemInfo", + "version-2.0.1-apis/device/systeminfo/getSystemInfoSync" + ] + }, + { + "label": "Wi-Fi", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/device/wifi/connectWifi", + "version-2.0.1-apis/device/wifi/getConnectedWifi", + "version-2.0.1-apis/device/wifi/getWifiList", + "version-2.0.1-apis/device/wifi/onGetWifiList", + "version-2.0.1-apis/device/wifi/offGetWifiList", + "version-2.0.1-apis/device/wifi/onWifiConnected", + "version-2.0.1-apis/device/wifi/offWifiConnected", + "version-2.0.1-apis/device/wifi/setWifiList", + "version-2.0.1-apis/device/wifi/startWifi", + "version-2.0.1-apis/device/wifi/stopWifi" + ] + } + ], + "扩展API": [ + "version-2.0.1-apis/extend-apis/arrayBufferToBase64", + "version-2.0.1-apis/extend-apis/base64ToArrayBuffer" + ], + "文件": [ + "version-2.0.1-apis/files/getFileInfo", + "version-2.0.1-apis/files/getSavedFileInfo", + "version-2.0.1-apis/files/getSavedFileList", + "version-2.0.1-apis/files/openDocument", + "version-2.0.1-apis/files/removeSavedFile", + "version-2.0.1-apis/files/saveFile" + ], + "界面": [ + { + "label": "动画", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/animation/createAnimation" + ] + }, + { + "label": "画布", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/canvas/createCanvasContext", + "version-2.0.1-apis/interface/canvas/canvasGetImageData", + "version-2.0.1-apis/interface/canvas/canvasPutImageData", + "version-2.0.1-apis/interface/canvas/canvasToTempFilePath", + "version-2.0.1-apis/interface/canvas/createContext", + "version-2.0.1-apis/interface/canvas/drawCanvas" + ] + }, + { + "label": "交互", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/interactives/showToast", + "version-2.0.1-apis/interface/interactives/showLoading", + "version-2.0.1-apis/interface/interactives/hideToast", + "version-2.0.1-apis/interface/interactives/hideLoading", + "version-2.0.1-apis/interface/interactives/showModal", + "version-2.0.1-apis/interface/interactives/showActionSheet" + ] + }, + { + "label": "导航", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/navigation/navigateTo", + "version-2.0.1-apis/interface/navigation/redirectTo", + "version-2.0.1-apis/interface/navigation/switchTab", + "version-2.0.1-apis/interface/navigation/navigateBack", + "version-2.0.1-apis/interface/navigation/reLaunch", + "version-2.0.1-apis/interface/navigation/getCurrentPages" + ] + }, + { + "label": "导航栏", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/navigationbar/setNavigationBarTitle", + "version-2.0.1-apis/interface/navigationbar/showNavigationBarLoading", + "version-2.0.1-apis/interface/navigationbar/hideNavigationBarLoading", + "version-2.0.1-apis/interface/navigationbar/setNavigationBarColor" + ] + }, + { + "label": "滚动", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/pagescroll/pageScrollTo" + ] + }, + { + "label": "下拉刷新", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/pulldownrefresh/startPullDownRefresh", + "version-2.0.1-apis/interface/pulldownrefresh/stopPullDownRefresh" + ] + }, + { + "label": "tabbar", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/tabbar/setTabBarBadge", + "version-2.0.1-apis/interface/tabbar/removeTabBarBadge", + "version-2.0.1-apis/interface/tabbar/showTabBarRedDot", + "version-2.0.1-apis/interface/tabbar/hideTabBarRedDot", + "version-2.0.1-apis/interface/tabbar/setTabBarStyle", + "version-2.0.1-apis/interface/tabbar/setTabBarItem", + "version-2.0.1-apis/interface/tabbar/showTabBar", + "version-2.0.1-apis/interface/tabbar/hideTabBar" + ] + }, + { + "label": "顶栏", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/topbar/setTopBarText" + ] + }, + { + "label": "窗口", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/window/onWindowResize", + "version-2.0.1-apis/interface/window/offWindowResize" + ] + }, + { + "label": "wxml", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/interface/wxml/createSelectorQuery", + "version-2.0.1-apis/interface/wxml/selectorQuery_in", + "version-2.0.1-apis/interface/wxml/selectorQuery_select", + "version-2.0.1-apis/interface/wxml/selectorQuery_selectAll", + "version-2.0.1-apis/interface/wxml/selectorQuery_selectViewport", + "version-2.0.1-apis/interface/wxml/nodesRef_boundingClientRect", + "version-2.0.1-apis/interface/wxml/nodesRef_scrollOffset", + "version-2.0.1-apis/interface/wxml/nodesRef_fields", + "version-2.0.1-apis/interface/wxml/selectorQuery_exec" + ] + } + ], + "位置": [ + "version-2.0.1-apis/location/getLocation", + "version-2.0.1-apis/location/openLocation", + "version-2.0.1-apis/location/chooseLocation" + ], + "媒体": [ + { + "label": "音频", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/multimedia/audio/playVoice", + "version-2.0.1-apis/multimedia/audio/pauseVoice", + "version-2.0.1-apis/multimedia/audio/stopVoice", + "version-2.0.1-apis/multimedia/audio/createAudioContext", + "version-2.0.1-apis/multimedia/audio/createInnerAudioContext" + ] + }, + { + "label": "背景音频", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/multimedia/backgroundaudio/getBackgroundAudioManager", + "version-2.0.1-apis/multimedia/backgroundaudio/getBackgroundAudioPlayerState", + "version-2.0.1-apis/multimedia/backgroundaudio/playBackgroundAudio", + "version-2.0.1-apis/multimedia/backgroundaudio/pauseBackgroundAudio", + "version-2.0.1-apis/multimedia/backgroundaudio/seekBackgroundAudio", + "version-2.0.1-apis/multimedia/backgroundaudio/stopBackgroundAudio", + "version-2.0.1-apis/multimedia/backgroundaudio/onBackgroundAudioPlay", + "version-2.0.1-apis/multimedia/backgroundaudio/onBackgroundAudioPause", + "version-2.0.1-apis/multimedia/backgroundaudio/onBackgroundAudioStop" + ] + }, + { + "label": "相机", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/multimedia/camera/createCameraContext" + ] + }, + { + "label": "图片", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/multimedia/images/chooseImage", + "version-2.0.1-apis/multimedia/images/previewImage", + "version-2.0.1-apis/multimedia/images/getImageInfo", + "version-2.0.1-apis/multimedia/images/saveImageToPhotosAlbum" + ] + }, + { + "label": "地图", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/multimedia/map/createMapContext" + ] + }, + { + "label": "录音", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/multimedia/recording/startRecord", + "version-2.0.1-apis/multimedia/recording/stopRecord" + ] + }, + { + "label": "视频", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/multimedia/video/chooseVideo", + "version-2.0.1-apis/multimedia/video/saveVideoToPhotosAlbum", + "version-2.0.1-apis/multimedia/video/createVideoContext" + ] + } + ], + "网络": [ + { + "label": "文件上传/下载", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/network/fileTransfer/uploadFile", + "version-2.0.1-apis/network/fileTransfer/downloadFile" + ] + }, + { + "label": "请求", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/network/request/request", + "version-2.0.1-apis/network/request/addInterceptor" + ] + }, + { + "label": "WebSocket", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/network/socket/connectSocket", + "version-2.0.1-apis/network/socket/sendSocketMessage", + "version-2.0.1-apis/network/socket/closeSocket", + "version-2.0.1-apis/network/socket/onSocketOpen", + "version-2.0.1-apis/network/socket/onSocketMessage", + "version-2.0.1-apis/network/socket/onSocketClose", + "version-2.0.1-apis/network/socket/onSocketError", + "version-2.0.1-apis/network/socket/SocketTask" + ] + } + ], + "开放接口": [ + { + "label": "地址", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/address/chooseAddress" + ] + }, + { + "label": "认证", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/auth/authorize" + ] + }, + { + "label": "生物认证", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/bioauth/checkIsSoterEnrolledInDevice", + "version-2.0.1-apis/open-api/bioauth/checkIsSupportSoterAuthentication", + "version-2.0.1-apis/open-api/bioauth/startSoterAuthentication" + ] + }, + { + "label": "卡券", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/card/addCard", + "version-2.0.1-apis/open-api/card/openCard" + ] + }, + { + "label": "发票", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/invoice/chooseInvoice", + "version-2.0.1-apis/open-api/invoice/chooseInvoiceTitle" + ] + }, + { + "label": "登录", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/login/login", + "version-2.0.1-apis/open-api/login/checkSession" + ] + }, + { + "label": "支付", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/payment/faceVerifyForPay", + "version-2.0.1-apis/open-api/payment/requestPayment" + ] + }, + { + "label": "跳转小程序", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/redirect/navigateBackMiniProgram", + "version-2.0.1-apis/open-api/redirect/navigateToMiniProgram" + ] + }, + { + "label": "设置", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/settings/getSetting", + "version-2.0.1-apis/open-api/settings/openSetting" + ] + }, + { + "label": "用户信息", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/userinfo/getUserInfo" + ] + }, + { + "label": "微信运动", + "type": "subcategory", + "ids": [ + "version-2.0.1-apis/open-api/werun/getWeRunData" + ] + } + ], + "数据缓存": [ + "version-2.0.1-apis/storage/setStorage", + "version-2.0.1-apis/storage/setStorageSync", + "version-2.0.1-apis/storage/getStorage", + "version-2.0.1-apis/storage/getStorageSync", + "version-2.0.1-apis/storage/getStorageInfo", + "version-2.0.1-apis/storage/getStorageInfoSync", + "version-2.0.1-apis/storage/removeStorage", + "version-2.0.1-apis/storage/removeStorageSync", + "version-2.0.1-apis/storage/clearStorage", + "version-2.0.1-apis/storage/clearStorageSync" + ], + "更新": [ + "version-2.0.1-apis/updates/getUpdateManager" + ] + } +} diff --git a/website/versions.json b/website/versions.json index 13cf6bc9394d..3e91b81d1c1f 100644 --- a/website/versions.json +++ b/website/versions.json @@ -1,4 +1,5 @@ [ + "2.0.1", "2.0.0", "2.0.0-beta.14", "2.0.0-beta.13",