问题
CloudKit js是苹果为web应用推出的CloudKit API。可惜,通过create-react-app 创建的工程直接引用CloudKit JS时不能解析它,直接报错: define is not defined ...
方案
通过webpack引入外部模块的方式来引入CloudKitjs。这样CloudKit不由Webpack编译,也不会打包到bundle.js中。
具体步骤如下:
index.html中
<script src="https://cdn.apple-cloudkit.com/ck/2/cloudkit.js"></script>
webpack.config.js (webpack.config.dev.js或者webpack.config.prod.js)中
module.exports = {
externals: {
CloudKit: 'CloudKit'
},
...
entry: [
// Include an alternative client for WebpackDevServer. A client's job is to
// connect to WebpackDevServer by a socket and get notified about changes.
// When you save a file, the client will either apply hot updates (in case
// of CSS changes), or refresh the page (in case of JS changes). When you
// make a syntax error, this client will display a syntax error overlay.
// Note: instead of the default WebpackDevServer client, we use a custom one
// to bring better experience for Create React App users. You can replace
// the line below with these two lines if you prefer the stock client:
// require.resolve('webpack-dev-server/client') + '?/',
// require.resolve('webpack/hot/dev-server'),
require.resolve('react-dev-utils/webpackHotDevClient'),
...
require.resolve('./cloudkit'),
在使用时直接像module一样引用即可:
import CloudKit from 'CloudKit';