Closed huadee1108 closed 2 years ago
Need more info. Share your package.json and tsconfig if there is one
package.json { "name": "xx", "version": "0.1.0", "private": true, "dependencies": { "@ant-design/charts": "^1.3.5", "@coinbase/wallet-sdk": "^3.4.0", "@craco/craco": "^6.2.0", "@ethersproject/providers": "^5.4.5", "@fontsource/poppins": "^4.5.8", "@headlessui/react": "^1.4.2", "@lingui/detect-locale": "^3.11.1", "@lingui/loader": "^3.11.1", "@lingui/react": "^3.11.1", "@reduxjs/toolkit": "^1.6.1", "@testing-library/jest-dom": "^5.11.4", "@testing-library/react": "^11.1.0", "@testing-library/user-event": "^12.1.10", "@types/jest": "^26.0.15", "@types/node": "^12.0.0", "@types/numeral": "^2.0.2", "@types/react": "^17.0.0", "@types/react-dom": "^17.0.0", "@walletconnect/web3-provider": "^1.8.0", "animejs": "^3.2.1", "antd": "^4.16.13", "aptos": "^1.3.14", "axios": "^0.26.1", "bignumber.js": "^9.0.2", "craco-antd": "^1.19.0", "cross-env": "^7.0.3", "ethers": "^5.6.9", "friendly-numbers": "^1.0.1", "http-proxy-middleware": "^2.0.4", "lodash": "^4.17.21", "moment": "^2.29.2", "numeral": "^2.0.6", "qs": "^6.10.3", "react": "^17.0.2", "react-cookies": "^0.1.1", "react-copy-to-clipboard": "^5.1.0", "react-countup": "^6.1.0", "react-device-detect": "^2.1.2", "react-dom": "^17.0.2", "react-feather": "^2.0.9", "react-helmet": "^6.1.0", "react-infinite-scroll-component": "^6.1.0", "react-infinite-scroller": "^1.2.6", "react-masonry-layout": "^0.4.0", "react-redux": "^7.2.5", "react-router-dom": "^5.3.0", "react-scripts": "4.0.3", "react-typewriter-hook": "^1.0.1", "react-uuid": "^1.0.3", "socket.io-client": "^4.5.1", "styled-components": "^5.3.5", "typescript": "^4.1.2", "vconsole": "^3.9.1", "web-vitals": "^1.0.1", "web3": "^1.7.5" }, "scripts": { "prebuild": "yarn extract && yarn compile", "start": "craco start", "build": "craco build", "test": "craco test", "eject": "react-scripts eject", "extract": "lingui extract", "compile": "lingui compile" }, "eslintConfig": { "extends": [ "react-app", "react-app/jest" ] }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] }, "devDependencies": { "@lingui/cli": "^3.11.1", "@lingui/macro": "^3.11.1", "@types/react-router-dom": "^5.3.2", "@types/styled-components": "^5.1.25", "autoprefixer": "^9", "postcss": "^7", "tailwindcss": "npm:@tailwindcss/postcss7-compat" } }
tsconfig.json { "compilerOptions": { "target": "es2015", "lib": [ "dom", "dom.iterable", "esnext" ], "allowJs": true, "skipLibCheck": true, "esModuleInterop": true, "allowSyntheticDefaultImports": true, "strict": true, "forceConsistentCasingInFileNames": true, "noFallthroughCasesInSwitch": true, "module": "esnext", "moduleResolution": "node", "resolveJsonModule": true, "isolatedModules": true, "noEmit": true, "jsx": "react-jsx", "baseUrl": "src" }, "include": [ "src" ] }
thank you for your help
Got the same errors in my dapp:
ERROR in ./node_modules/aptos/dist/index.mjs 78:25-35
Can't import the named export 'bytesToHex' from non EcmaScript module (only default export is available)
@ ./src/index.js
ERROR in ./node_modules/aptos/dist/index.mjs 232:37-48
Can't import the named export 'bytesToHex' from non EcmaScript module (only default export is available)
@ ./src/index.js
ERROR in ./node_modules/aptos/dist/index.mjs 34:21-31
Can't import the named export 'hexToBytes' from non EcmaScript module (only default export is available)
@ ./src/index.js
ERROR in ./node_modules/aptos/dist/index.mjs 107:27-38
Can't import the named export 'hexToBytes' from non EcmaScript module (only default export is available)
@ ./src/index.js
ERROR in ./node_modules/aptos/dist/index.mjs 33:12-16
Can't import the named export 'hmac' from non EcmaScript module (only default export is available)
@ ./src/index.js
ERROR in ./node_modules/aptos/dist/index.mjs 48:12-16
Can't import the named export 'hmac' from non EcmaScript module (only default export is available)
@ ./src/index.js
ERROR in ./node_modules/aptos/dist/index.mjs 232:49-73
Can't import the named export 'mnemonicToSeedSync' from non EcmaScript module (only default export is available)
@ ./src/index.js
ERROR in ./node_modules/aptos/dist/index.mjs 33:24-30
Can't import the named export 'sha512' from non EcmaScript module (only default export is available)
@ ./src/index.js
ERROR in ./node_modules/aptos/dist/index.mjs 48:24-30
Can't import the named export 'sha512' from non EcmaScript module (only default export is available)
@ ./src/index.js
here is the package.json:
{
"name": "xx",
"version": "1.5.0",
"engines": {
"node": ">= 10"
},
"scripts": {
"deploy": "./deploy.sh",
"lint": "eslint . --ext js,json && prettier ./src -c",
"lint:fix": "eslint . --fix --ext js,json && prettier ./src -c --write",
"start": "webpack-dev-server",
"build": "webpack --mode production",
"test": "yarn lint",
"prepublishOnly": "yarn test && yarn build"
},
"publishConfig": {
"access": "public"
},
"files": [
"dist/"
],
"license": "MIT",
"dependencies": {
"@ethersproject/bytes": "^5.0.6",
"aptos": "1.3.13",
"bignumber.js": "^9.0.1",
"compare-versions": "^4.1.2",
"jquery": "^3.4.1"
},
"devDependencies": {
"@metamask/eslint-config": "^4.0.0",
"@starcoin/starcoin": "^1.8.0",
"@starcoin/starmask-onboarding": "^1.0.0",
"clean-webpack-plugin": "^3.0.0",
"copy-webpack-plugin": "^6.0.2",
"eslint": "^7.7.0",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-json": "^2.0.1",
"eslint-plugin-node": "^11.1.0",
"eth-sig-util": "^2.5.3",
"ethereumjs-util": "^5.1.1",
"ethers": "^5.0.32",
"gh-pages": "^3.1.0",
"prettier": "^2.0.5",
"webpack": "^4.43.0",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"
}
}
here is the webpack.config.js:
const path = require('path')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const CopyPlugin = require('copy-webpack-plugin')
const DIST = path.resolve(__dirname, 'dist')
module.exports = {
devtool: 'eval-source-map',
mode: 'development',
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: DIST,
publicPath: DIST,
},
devServer: {
contentBase: DIST,
port: 9022,
writeToDisk: true,
},
plugins: [
new CleanWebpackPlugin({ cleanStaleWebpackAssets: false }),
// for build scripts
new CopyPlugin({
patterns: [
{
flatten: true,
from: './src/*',
globOptions: {
ignore: ['**/*.js'],
},
},
],
}),
],
}
These means that webpack or craco do not know .mjs are ESM modules. See https://stackoverflow.com/questions/71054449/cant-import-the-named-export-directive-from-non-ecmascript-module-only-defau. I verified that the below works for webpack.
module: {
rules: [
{
test: /\.mjs$/,
include: /node_modules/,
type: "javascript/auto",
},
],
},
Unfortunately, I don't have time to test every bundler. Project owners should make sure their bundler can bundle the Aptos SDK.
🐛 Bug