Problems encountered in the development of native front end:
Uncaught TypeError: document.getElementsByClassName(...).addEventListener is not a function......
reason:
The
Run a web page and find the key “target density Pi” is not supported in the log
After checking the relevant information, it is found that the target densitydpi attribute has been abandoned. Specific reference https://petelepage.com/blog/2013/02/viewport-target-densitydpi-support-is-being-deprecated/
“Support for target densitydpi in the viewport meta tag was recently removed from WebKit and with chrome for Android moving forward to current revisions on WebKit, this change is now rolling out in Android.”
In other words, target density PI has been enabled.
At the same time, this blog also gives people a usage, that is, in WebKit, if you need to put target density DPI = device DPI.
My strategy is simpler. When I find that target density Pi is useless in the web page, I delete the relevant attributes directly in the web page.
var leftNavMenu = '';
$('#leftNav').parent().find('ul[class*="layui-nav-tree"] > li[class*="layui-nav-item"]').each(function () {
leftNavMenu = leftNavMenu + $(this).prop('outerHTML');
});
storageK.setItem("leftNav", leftNavMenu);
Today, I want to copy the pictures of the company’s projects to build / images,
Direct installation
npm install copy-webpack-plugin --save-dev, using the latest official documentation
new CopyPlugin({
patterns: [
{ from: 'source', to: 'dest' },
{ from: 'other', to: 'public' },
],
}),However, it is always reported that cannot read property ‘this compilation’ of undefined
The results show that the webpack is “^ 1.13.2” because the company’s projects are older,
So you can reduce the copy webpack plugin version to below 5.0.0, and then use the old writing method
For example, “copy webpack plugin”: “^ 4.6.0”,
@vue/clibr> <>e> package>on > code>package
"devDependencies": {
"@vue/cli": "^4.4.6"
}
First remove the node - the module
and reinstall the NPM install
This is a low-level error in Vue development that can be encountered but is shared here so that it can be resolved if encountered
To explain the development environment in which this problem occurs: native Mac + NVM-managed node uses Node V8.0.0 to install vue-cli globally: NPM install vue-cli-g
Error is as follows
/Users/weiyongqiang/.nvm/versions/node/v9.2.0/lib/node_modules/vue-cli/node_modules/[email protected]@rimraf/rimraf.js:313
throw er
^
Error: EACCES: permission denied, unlink '/Users/weiyongqiang/.vue-templates/webpack/.gitignore'Error analysis
This problem is actually relatively simple. The intuitive error is that an exception is thrown on line 313 of rimraf.js. Exploring the cause of this problem requires understanding the role of rimraf.js. It uses the rm -rf command of Unix for deep package deletions. RM-RF is required to operate the corresponding permissions.
Error resolution
Run the vue command with sudo
sudo vue init webpackAlthough the solution to this problem is very simple but I believe that many people will encounter, the use of Windows system, of course, will not appear the problem of authority.
echarts.format.formatTime('yyyy-MM-dd', +new Date());
//"2021-02-25"
:
ah:
:
In the file & gt; > > > Preferences Settings> > > > > Search for eslint
* in Settings. Json and add the following code to the outer braces.
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true,
"eslint.autoFixOnSave" : true,
},
After the file is saved, you can fix the code automatically.
[Vue warn]: Error in render: “TypeError: Cannot read property ‘_t’ of undefined”
The compatibility issue between Vue and i18n is the multi-language configuration used in the project. The solution is as follows:
Vue.use(iView)
replace
Vue.use(iView, {
i18n: function(path, options) {
let value = i18n.t(path, options)
if (value !== null && value !== undefined) {
return value
}
return ''
}
})
Internationalization other items are configured unchanged and are recorded only.
Reference articles:
https://github.com/iview/iview/issues/1090
service.interceptors.request.use(
config => {
config.data = JSON.stringify(config.data);
config.headers['Authorization'] = getToken();
config.headers['Content-Type'] = "application/json;charset=utf-8";
return config;
},
error => {
return Promise.reject();
}
);The Axios source code under NPM removes the Content-Type setting when RequestData is not set
// Add headers to the request
if ('setRequestHeader' in request) {
utils.forEach(requestHeaders, function setRequestHeader(val, key) {
if (typeof requestData === 'undefined' && key.toLowerCase() === 'content-type') {
// Remove Content-Type if data is undefined
delete requestHeaders[key];
} else {
// Otherwise add header to the request
request.setRequestHeader(key, val);
}
});
}Solution:
If (typeof requestData === ‘undefined’ & & Key.tolowerCase () === ‘Content-Type ‘)
2. Assign config.data = true to requestData
service.interceptors.request.use(
config => {
config.data = JSON.stringify(config.data);
config.headers['Authorization'] = getToken();
config.data = true
config.headers[ 'Content-Type'] = "application/json;charset=utf-8";
return config;
},
error => {
return Promise.reject();
}
);
Reference data: https://blog.csdn.net/qq_24729895/article/details/80367460
