Ant-design: एंटडी थीम आयात करें, वेबपैक बिल्ड शो .bezierEasingMixin त्रुटि?

यह कम नया संस्करण बग !!!!! बंद करे!

 Inline JavaScript is not enabled. Is it set in your options?

आप इनलाइन जावास्क्रिप्ट विकल्प को चालू करने का प्रयास कर सकते हैं।

यह विकल्प कहां सेट करें?

संस्करण: [email protected]

कम@2 .

कम@3.x , कॉन्फ़िगरेशन आइटम जावास्क्रिप्ट सक्षम: सत्य को चालू करने की आवश्यकता है

{ loader: 'less-loader', options: { javascriptEnabled: true } }

लेकिन अभी भी त्रुटियां हैं:

@Lovesueee ट्रैक https://github.com/less/less.js/issues/3113 . के साथ

ऐसा लगता है कि फ़ंक्शन हैक का उपयोग करने के बजाय कम प्लगइन्स को लागू करने के लिए यह antd तक है। हम @yesmeck को ठीक करने की उम्मीद कब कर सकते हैं?

https://github.com/ant-design/ant-design/commit/9634bea391dd2b7b17f1e89383577e248081a044 में फिक्स्ड

बहुत बढ़िया, क्या आप इस सुधार के साथ एक नया संस्करण प्रकाशित कर सकते हैं? धन्यवाद!

@bkniffler इस सप्ताह के अंत में।

@bkniffler आप वर्कअराउंड के रूप में कम 2.7 का उपयोग कर सकते हैं।

@yesmeck को यकीन नहीं है कि क्यों, लेकिन मुझे अभी भी 3.3.0 रिलीज के साथ अपवाद मिलता है। 2.7 में डाउनग्रेड करने पर सब कुछ अपेक्षा के अनुरूप काम करता है।

@madisvain { loader: 'less-loader', options: { javascriptEnabled: true } } अगर आप कम @ 3 . का उपयोग कर रहे हैं

[email protected]
कम@2.x
कम लोडर@3.x
.बेबेलआरसी

"style": true,

काम!

कॉन्फ़िगरेशन में क्या गलत है और शैली की रिपोर्ट नहीं की गई है या प्रदर्शित नहीं की गई है?

और 3.6.3
कम 2.7.2
कम लोडर 4.1.0

@webMasterMrBin कम लोडर के माध्यम से सीएसएस फाइलों को पार्स न करने का प्रयास करें

@afc163 वेबपैक की बुनियादी बातों को पूरा करने के लिए धन्यवाद

मैंने create-react-app को बाहर नहीं किया, और मैं react-app-rewire-less का उपयोग कर रहा हूं, और जब मैं 2.1.1 से 2.1.2 तक पैकेज को अपडेट करता हूं, तो वही समस्या हुई।

मेरा समाधान package.json में संस्करण को "2.1.1" पर रखना है।

आशा है कि इससे सहायता मिलेगी।

@FeynmanDNA या आप इस विकल्प को config-overrides.js में जोड़ सकते हैं:

config = rewireLess.withLoaderOptions({
  javascriptEnabled: true 
})(config, env);

@froston धन्यवाद! इससे मेरा काम बनता है

मैंने कंसोल पर @froston स्क्रिप्ट को जोड़ा जो मुझे मिलता है:

Failed to compile
./src/resources/_antd.less
Module build failed: 


.antCheckboxFn();
^
Cannot read property 'eval' of null
      in /Users/ulisescarreon/Sites/doux_repositories/cleanui-admin-template-react/node_modules/antd/lib/checkbox/style/index.less (line 4, column 0)

कोई सलाह?

@froston :

क्या इनलाइन जावास्क्रिप्ट को सक्षम करना असुरक्षित नहीं है?

अरे @ulisecarreonalvarez क्या आपने इसे ठीक किया?

@hecomp

नमस्ते बस package.json पर इसे बदलें:

"react-app-rewire-less": "^2.1.1",

इसके लिए:

"react-app-rewire-less": "2.1.1",

नमस्ते @ulisescarreonalvarez आपका antd संस्करण क्या है?
यह अभी मिल रहा है।
./src/resources/_antd.less Module build failed: Error: Cannot find module 'less'

मेरा 3.5.3 . है

@ulisescarreonalvarez क्या आप अपना config-override.js साझा कर सकते हैं?

@hecomp config-overrides.js:

const rewired = require('react-app-rewired')
const rewireLess = require('react-app-rewire-less')
const rewireEslint = require('react-app-rewire-eslint')

function rewire(config, env) {
  const cssLoader = rewired.getLoader(
    config.module.rules,
    rule => rule.test && String(rule.test) === String(/\.css$/)
  )
  const sassLoader = {
    test: /\.scss$/,
    use: [...(cssLoader.loader || cssLoader.use), 'sass-loader']
  }
  const oneOf = config.module.rules.find(rule => rule.oneOf).oneOf
  oneOf.unshift(sassLoader)

  config = rewired.injectBabelPlugin('transform-decorators-legacy', config)
  config = rewireLess(config, env)
  config = rewireEslint(config, env)
  config = rewireLess.withLoaderOptions({
    javascriptEnabled: true 
  })(config, env);

  return config
}

module.exports = rewire

jsconfig.json:

{
  "compilerOptions": {
    "target": "ES6",
    "experimentalDecorators": true
  },
  "exclude": ["node_modules"]
}

पैकेज.जेसन:

{
  "name": "Project",
  "version": "0.1.0",
  "private": true,
  "homepage": ".",
  "devDependencies": {
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "husky": "^0.14.3",
    "lint-staged": "^4.0.2",
    "node-sass": "^4.9.0",
    "prettier": "^1.5.3",
    "querystring": "^0.2.0",
    "react-app-rewire-eslint": "^0.2.3",
    "react-app-rewire-less": "2.1.1",
    "react-app-rewired": "^1.5.2",
    "react-dnd": "^2.6.0",
    "react-dnd-html5-backend": "^2.6.0",
    "react-scripts": "^1.1.4",
    "redux-devtools-extension": "^2.13.0",
    "redux-logger": "^3.0.1",
    "sass-loader": "^7.0.1"
  },
  "dependencies": {
    "@rowno/sparkline": "^3.0.1",
    "ajv": "^6.5.0",
    "antd": "^3.5.3",
    "axios": "^0.18.0",
    "bootstrap": "^4.1.1",
    "chart.js": "^2.7.2",
    "chartist": "^0.10.1",
    "chartist-plugin-tooltip": "^0.0.11",
    "classnames": "^2.2.5",
    "d3-dsv": "^1.0.8",
    "d3-format": "^1.2.1",
    "d3-scale": "^1.0.7",
    "d3-time-format": "^2.1.1",
    "draft-js": "^0.10.5",
    "enquire-js": "^0.2.1",
    "fetch-jsonp": "^1.1.3",
    "immutability-helper": "^2.7.0",
    "immutable": "^3.8.2",
    "jquery": "^3.3.1",
    "lodash": "^4.17.10",
    "moment": "^2.19.3",
    "moment-timezone": "^0.5.14",
    "peity-react": "^0.0.7",
    "popper.js": "^1.14.3",
    "prop-types": "^15.5.10",
    "rc-drawer-menu": "^0.5.7",
    "react": "^16.4.0",
    "react-avatar-editor": "^10.2.1",
    "react-c3js": "^0.1.20",
    "react-chartist": "^0.13.1",
    "react-chartjs-2": "^2.7.0",
    "react-container-query": "^0.11.0",
    "react-custom-scrollbars": "^4.2.1",
    "react-dom": "^16.4.0",
    "react-draft-wysiwyg": "^1.12.13",
    "react-helmet": "^5.2.0",
    "react-infinite-scroller": "^1.1.4",
    "react-loadable": "^5.4.0",
    "react-redux": "^5.0.7",
    "react-redux-spinner": "^1.1.3",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "react-router-redux": "^5.0.0-alpha.6",
    "react-stockcharts": "^0.7.0-beta.22",
    "react-syntax-highlighter": "^7.0.4",
    "react-transition-group": "^2.3.1",
    "react-virtualized": "^9.18.5",
    "redux": "^3.7.2",
    "redux-act": "^1.3.0",
    "redux-thunk": "^2.2.0",
    "reqwest": "^2.0.5",
    "webpack": "^3.12.0"
  },
  "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "eject": "react-scripts eject",
    "precommit": "lint-staged"
  },
  "lint-staged": {
    "src/**/*.js": [
      "prettier --tab-width 2 --print-width 100 --single-quote --trailing-comma all --no-semi --parser babylon --write"
    ]
  }
}

@Remimstr

क्या इनलाइन जावास्क्रिप्ट को सक्षम करना असुरक्षित नहीं है?

यह हो सकता है। खतरा यह है कि कभी-कभी कम पुस्तकालयों के लिए थीमिंग को सक्षम करने के लिए चर के लिए "ऑनलाइन कॉन्फ़िगरेशन" होना आम बात है। यदि आप उस इनपुट को साफ नहीं करते हैं, तो आप अनिवार्य रूप से किसी भी कोड का मूल्यांकन कर रहे हैं जैसे:

@theme-color: `code_to_delete_my_whole_computer_oops()`

तो उपयोगकर्ताओं को इस लाइब्रेरी का उपयोग जारी रखने के लिए जावास्क्रिप्ट सक्षम विकल्प को ओवरराइड करने के लिए मजबूर करके, आप अनिवार्य रूप से एक संभावित सुरक्षा छेद खोल रहे हैं जो इसे अक्षम करने से रोकता है। सच है, यह केवल तब होता है जब आपने उस विकल्प के साथ कम में बिना सैनिटरी इनपुट डाल दिया है, लेकिन विकल्प के बिना, अनसैनिटाइज्ड इनपुट बस पार्स नहीं होगा। इसलिए डिज़ाइन लाइब्रेरी को ठीक करना और javascriptEnabled: true विकल्प को बाध्य करने के बजाय @plugin सिंटैक्स का उपयोग करना बेहतर है।

@ मैथ्यू-डीन क्या आप इसे हासिल करने में हमारी मदद कर सकते हैं?

@ afc163 ज़रूर। सबसे पहले, यह विशाल कार्य वास्तव में क्या कर रहा है? यह स्पष्ट नहीं है कि आउटपुट क्या है।

जैसे, यह लाइन this.colorEasing । लेकिन क्यों? this का मान यहाँ क्या होना चाहिए? क्या यह ग्लोबल्स को दूसरे मॉड्यूल में लीक करने की कोशिश कर रहा है? https://github.com/ant-design/ant-design/blob/cfdf06213b952451600ae659e69fa302a7baf271/components/style/color/bezierEasing.less#L102

एक मुद्दे के आधार पर मैंने कुछ समय पहले दायर किया था, ऐसा प्रतीत होता है कि हां, आप उद्देश्य पर ग्लोबल्स को रूट नेमस्पेस में लीक कर रहे हैं। https://github.com/ant-design/ant-design/issues/11097

@ मैथ्यू-डीन मेरे प्रश्न को संबोधित करने के लिए धन्यवाद!

@ afc163 ने यहां पीआर बनाया। https://github.com/ant-design/ant-design/pull/13242

उम्मीद है की वो मदद करदे।

हे यार, मुझे एक त्रुटि मिली, ऐसा लगता है, जब मैं antd का उपयोग करता हूं।

./src/index.less
मॉड्यूल निर्माण विफल:

// https://github.com/ant-design/ant-motion/issues/44
.tinyColorMixin ();
^

और मेरी config-overrides.js
कॉन्स्ट {इंजेक्टबैबेलप्लगिन} = आवश्यकता ('प्रतिक्रिया-ऐप-रिवायर्ड');
const rewireLess = आवश्यकता ('प्रतिक्रिया-ऐप-रीवायर-कम');

मॉड्यूल.एक्सपोर्ट्स = फ़ंक्शन ओवरराइड (कॉन्फ़िगरेशन, एनवी) {
कॉन्फिग = इंजेक्टबैबेलप्लगिन (
['आयात', {लाइब्रेरीनाम: 'antd', पुस्तकालय निर्देशिका: 'es', शैली: सत्य}], // आयात करने वाले सीएसएस को कम में बदलें
कॉन्फ़िग
);
config = rewireLess.withLoaderOptions({
जावास्क्रिप्ट सक्षम: सत्य
}) (कॉन्फ़िगरेशन, एनवी);
वापसी विन्यास;
};

मेरा पैकेज.जेसन इस तरह

"प्रतिक्रिया-ऐप-रीवायर-कम": "^ 2.1.3",
"react-app-rewired": "^1.6.2",

अरे - मैं एक परियोजना को जेएसएक्स से जेएसएक्स + टीएस में माइग्रेट करने की कोशिश कर रहा हूं।
यह वास्तव में JHipster का उपयोग करके पहले से विकसित कुछ के साथ एक व्यवस्थापक टेम्पलेट विलय कर रहा है।

मुझे निम्न त्रुटि मिल रही है जो मुझे लगता है कि दूसरों को इस धागे में मिला है ...

./src/resources/_antd.less में त्रुटि (./node_modules/css-loader??ref--9-1!./node_modules/less-loader/dist/cjs.js??ref--9-2! ./src/resources/_antd.less)
मॉड्यूल निर्माण विफल (./node_modules/less-loader/dist/cjs.js से):
.antCheckboxFn ();
^
शून्य की संपत्ति 'eval' पढ़ा नहीं जा सकता
Documentswscleanui-typescriptnode_modulesantdlibcheckboxstyleindex.less (पंक्ति 4, कॉलम 0) में

और मेरे वेबपैक कॉन्फ़िगरेशन में मैं कम लोडर जावास्क्रिप्ट विकल्प का उपयोग कर रहा हूं।
इसे अक्षम करना 'इनलाइन जावास्क्रिप्ट' त्रुटि दिखाता है, और सक्षम करना उपरोक्त दिखाता है।

कोई विचार?

webpack.dev.js
मापांक: {
नियम: [
{
परीक्षण: /.कम $/,
उपयोग: [
{लोडर: 'स्टाइल-लोडर'//जेएस स्ट्रिंग्स से स्टाइल नोड्स बनाता है
}, {
लोडर: 'css-loader', // CSS का CommonJS में अनुवाद करता है
विकल्प: {आयात लोडर: 1}
},
{
लोडर: 'कम लोडर',
विकल्प: {
जावास्क्रिप्ट सक्षम: सत्य
}
}]
},
{
परीक्षण: /। (एसए | एससी | सी) एसएस $ /,
उपयोग करें: ['स्टाइल-लोडर', 'सीएसएस-लोडर', 'पोस्टसीएसएस-लोडर', {
लोडर: 'एसएएस-लोडर',
विकल्प: {कार्यान्वयन: एसएएस}
}
]
},
]
}
`

पैकेज.जेसन

[{
  "name": "tensor-base-template",
  "version": "0.1.0",
  "private": true,
  "homepage": ".",
  "devDependencies": {
    "@types/chai": "4.1.4",
    "@types/enzyme": "3.1.13",
    "@types/jest": "23.3.1",
    "@types/lodash": "4.14.116",
    "@types/mocha": "5.2.5",
    "@types/node": "10.9.2",
    "@types/react": "16.4.12",
    "@types/react-dom": "16.0.7",
    "@types/react-redux": "6.0.6",
    "@types/react-router-dom": "4.3.0",
    "@types/redux": "3.6.31",
    "@types/selenium-webdriver": "3.0.10",
    "@types/webpack-env": "1.13.6",
    "autoprefixer": "9.2.0",
    "browser-sync": "2.26.3",
    "browser-sync-webpack-plugin": "2.2.2",
    "cache-loader": "1.2.2",
    "chai": "4.1.2",
    "chai-as-promised": "7.1.1",
    "copy-webpack-plugin": "4.5.2",
    "core-js": "2.5.7",
    "cross-env": "5.2.0",
    "css-loader": "1.0.0",
    "enzyme": "3.5.0",
    "enzyme-adapter-react-16": "1.3.0",
    "enzyme-to-json": "3.3.4",
    "file-loader": "2.0.0",
    "fork-ts-checker-webpack-plugin": "0.4.9",
    "friendly-errors-webpack-plugin": "1.7.0",
    "generator-jhipster": "5.7.0",
    "html-webpack-plugin": "3.2.0",
    "husky": "1.1.0",
    "identity-obj-proxy": "3.0.0",
    "jest": "23.5.0",
    "jest-junit": "5.1.0",
    "jest-sonar-reporter": "2.0.0",
    "json-loader": "0.5.7",
    "less": "^3.9.0",
    "less-loader": "^4.1.0",
    "lint-staged": "7.3.0",
    "mini-css-extract-plugin": "0.4.2",
    "mocha": "5.2.0",
    "moment-locales-webpack-plugin": "1.0.7",
    "optimize-css-assets-webpack-plugin": "5.0.0",
    "postcss-loader": "3.0.0",
    "prettier": "1.14.3",
    "protractor": "5.4.0",
    "react-infinite-scroller": "1.2.0",
    "redux-mock-store": "1.5.3",
    "rimraf": "2.6.2",
    "sass": "1.13.0",
    "sass-loader": "7.1.0",
    "simple-progress-webpack-plugin": "1.1.2",
    "sinon": "6.1.5",
    "source-map-loader": "0.2.4",
    "sourcemap-istanbul-instrumenter-loader": "0.2.0",
    "stripcomment-loader": "0.1.0",
    "style-loader": "0.22.1",
    "swagger-ui": "2.2.10",
    "terser-webpack-plugin": "1.0.2",
    "thread-loader": "1.2.0",
    "to-string-loader": "1.1.5",
    "ts-jest": "23.1.4",
    "ts-loader": "4.5.0",
    "ts-node": "7.0.1",
    "tslint": "5.11.0",
    "tslint-config-prettier": "1.15.0",
    "tslint-eslint-rules": "5.4.0",
    "tslint-loader": "3.6.0",
    "tslint-react": "3.6.0",
    "typescript": "3.0.1",
    "webpack": "4.17.1",
    "webpack-cli": "3.1.0",
    "webpack-dev-server": "3.1.6",
    "webpack-merge": "4.1.4",
    "webpack-notifier": "1.7.0",
    "workbox-webpack-plugin": "3.4.1",
    "write-file-webpack-plugin": "4.3.2",
    "xml2js": "0.4.19"
  },
  "dependencies": {
    "@rowno/sparkline": "^3.0.1",
    "antd": "^3.11.2",
    "axios": "^0.18.0",
    "bootstrap": "^4.1.1",
    "classnames": "^2.2.5",
    "enquire-js": "^0.2.1",
    "immutability-helper": "^2.7.0",
    "immutable": "^3.8.2",
    "lodash": "^4.17.10",
    "moment": "^2.19.3",
    "moment-timezone": "^0.5.14",
    "peity-react": "^0.0.7",
    "prop-types": "^15.5.10",
    "rc-drawer": "^1.4.4",
    "react": "^16.4.12",
    "react-container-query": "^0.11.0",
    "react-custom-scrollbars": "^4.2.1",
    "react-dom": "^16.4.7",
    "react-helmet": "^5.2.0",
    "react-hot-loader": "3.1.1",
    "react-infinite-scroller": "^1.1.4",
    "react-loadable": "^5.4.0",
    "react-redux": "5.0.7",
    "react-redux-spinner": "^1.1.3",
    "react-router": "^4.2.0",
    "react-router-dom": "4.3.1",
    "react-router-redux": "^5.0.0-alpha.6",
    "redux": "^3.7.2",
    "redux-act": "^1.3.0",
    "redux-devtools": "3.4.1",
    "redux-devtools-dock-monitor": "1.1.3",
    "redux-devtools-extension": "^2.13.7",
    "redux-devtools-log-monitor": "1.4.0",
    "redux-logger": "^3.0.6",
    "redux-promise-middleware": "5.1.1",
    "redux-thunk": "^2.2.0"
  },
  "scripts": {
    "prettier:format": "prettier --write \"src/**/*.{json,ts,tsx,css,scss}\"",
    "lint": "tslint --project tsconfig.json -e 'node_modules/**'",
    "lint:fix": "npm run lint -- --fix",
    "cleanup": "rimraf target/www",
    "start": "npm run webpack:dev",
    "start-tls": "npm run webpack:dev -- --env.tls",
    "test": "npm run lint && jest --coverage --logHeapUsage -w=2 --config src/test/javascript/jest.conf.js",
    "test:watch": "npm test -- --watch",
    "webpack:dev": "npm run webpack-dev-server -- --config webpack/webpack.dev.js --inline --port=9060 --env.stats=minimal",
    "webpack:dev-verbose": "npm run webpack-dev-server -- --config webpack/webpack.dev.js --inline --port=9060 --profile --progress --env.stats=normal",
    "webpack:build:main": "npm run webpack -- --config webpack/webpack.dev.js --env.stats=minimal",
    "webpack:build": "npm run cleanup && npm run webpack:build:main",
    "webpack:prod:main": "npm run webpack -- --config webpack/webpack.prod.js --profile",
    "webpack:prod": "npm run cleanup && npm run webpack:prod:main",
    "webpack:test": "npm run test",
    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
    "webpack": "node --max_old_space_size=4096 node_modules/webpack/bin/webpack.js"
  },
  "lint-staged": {
    "src/**/*.js": [
      "prettier --tab-width 2 --print-width 100 --single-quote --trailing-comma all --no-semi --parser babylon --write"
    ]
  }
}
]

उन लोगों के लिए जो अभी भी node-less-chokidar का उपयोग करते समय इस समस्या का सामना कर रहे हैं।

ऐसा लगता है कि इसके लिए एक जनसंपर्क किया गया है लेकिन इसे 2 महीने से अधिक समय तक विलय नहीं किया गया था। आप अपनी \node_modules\node-less-chokidar\bin\node-less-chokidar फ़ाइल में उस पीआर की प्रतिबद्धता में किए गए परिवर्तन स्वयं कर सकते हैं (इसकी केवल कुछ पंक्तियां) और यह काम करता है।

यहाँ प्रतिबद्ध विवरण है

https://github.com/sampi/node-less-chokidar/pull/14/commits/934af235d16f63edaf9b8ae04eb22e3b82917701

संपादित करें: इसे नोड-कम-चोकीधर में अभी तक मास्टर करने के लिए विलय कर दिया गया है

यदि प्लग-इन संस्करण (कम-लोडर) संख्या 6 या अधिक है：
"कम लोडर": "^ 6.1.0",
"कम": "^ 2.7.3",

इसे लिखने का नया तरीका है
{
लोडर: "कम लोडर",
विकल्प: {
कम विकल्प: {
जावास्क्रिप्ट सक्षम: सच,
}
}
}

यदि प्लग-इन संस्करण (कम-लोडर) संख्या 6 या अधिक है：
"कम लोडर": "^ 6.1.0",
"कम": "^ 2.7.3",

इसे लिखने का नया तरीका है
{
लोडर: "कम लोडर",
विकल्प: {
कम विकल्प: {
जावास्क्रिप्ट सक्षम: सच,
}
}
}

प्रारूप कोड शैली:

{
  loader: 'less-loader',
  options: {
    lessOptions: {
      javascriptEnabled: true
    }
  }
}