Doc: Turn "Checking Code Syntax" into how-to and reference topics

Task-number: QTCREATORBUG-29361
Change-Id: I96c4384dbde04189be3c80c3b21ee09ca33fb90c
Reviewed-by: Eike Ziller <eike.ziller@qt.io>
This commit is contained in:
Leena Miettinen
2024-03-14 16:47:12 +01:00
parent 263d5ff1e6
commit 05b640abc0
13 changed files with 157 additions and 157 deletions

View File

@@ -4,7 +4,7 @@
/*! /*!
\page creator-completing-code.html \page creator-completing-code.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage creator-editor-functions.html \previouspage qtquick-text-editor.html
\else \else
\previouspage creator-how-tos.html \previouspage creator-how-tos.html
\endif \endif

View File

@@ -4,8 +4,7 @@
/*! /*!
\page creator-indenting-code.html \page creator-indenting-code.html
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\previouspage creator-completing-code.html \previouspage qtquick-text-editor.html
\nextpage creator-preferences-text-editor-behavior.html
\else \else
\previouspage creator-how-tos.html \previouspage creator-how-tos.html
\endif \endif

View File

@@ -1,60 +1,74 @@
// Copyright (C) 2023 The Qt Company Ltd. // Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*! /*!
\previouspage creator-highlighting.html
\page creator-checking-code-syntax.html \page creator-checking-code-syntax.html
\nextpage creator-completing-code.html \if defined(qtdesignstudio)
\previouspage qtquick-text-editor.html
\else
\previouspage creator-how-tos.html
\endif
\title Checking Code Syntax \ingroup creator-how-to-edit
\title Check code syntax
As you write code, \QC checks code syntax. When \QC spots a syntax error in As you write code, \QC checks code syntax. When \QC spots a syntax error in
your code, it underlines it, displays an icon, and shows error details when your code, it underlines it, displays an icon, and shows error details when
you move the mouse pointer over the error or the icon. If a fix is available, you move the mouse pointer over the error or the icon. To apply an available
you can apply it by clicking \inlineimage icons/refactormarker.png fix, select \inlineimage icons/refactormarker.png.
.
Similarly, when you are working on an instance of a JavaScript object Similarly, when you are working on an instance of a JavaScript object
notation (JSON) entity, \QC underlines errors in the JSON data structure. notation (JSON) entity, \QC underlines errors in the JSON data structure.
\if defined(qtcreator) \if defined(qtcreator)
In the following screenshot, \QC annotates an error because a semicolon is \section1 Examples of C++ code errors
missing at the end of the line:
\QC annotates an error because a semicolon is missing at the end of the line:
\image qtcreator-syntaxerror.png {Syntax error in the Edit mode} \image qtcreator-syntaxerror.png {Syntax error in the Edit mode}
In the following screenshot, \QC issues a warning because the variable is \QC issues a warning because the variable is not used:
not used:
\image qtcreator-semanticerror.png \image qtcreator-semanticerror.png
In the following screenshot, a Qt class name has a typo: A Qt class name has a typo:
\image qtcreator-typo-clang.png {Annotation tooltip in the Edit mode} \image qtcreator-typo-clang.png {Annotation tooltip in the Edit mode}
You can use the icons in the tooltip popup to copy the error or \section1 Check QML or JavaScript syntax
warning message to the clipboard, to hide messages of a particular type, \endif
or to \l{Clangd}{change the diagnostics settings}. Select
the \uicontrol {Annotation Settings} link to specify the position
of the line annotations.
To modify the colors used for underlining errors and warnings, select \if defined(qtdesignstudio)
\preferences > \uicontrol {Text Editor} >
\uicontrol {Font & Colors} > \uicontrol Copy, and select new colors for
\uicontrol Error and \uicontrol Warning.
\else
In addition to underlining, errors and warnings are marked with icons and In addition to underlining, errors and warnings are marked with icons and
annotated. annotated.
\endif \endif
When writing QML or JavaScript code, the annotations may have error codes When writing QML or JavaScript code, the annotations may have error codes
listed in \l{JavaScript and QML Error Codes}. listed in \l{JavaScript and QML Error Codes}.
\image qml-syntax-check.png \image qml-syntax-check.png
\section1 Specifying Line Annotation Positions \section1 Manage messages
To specify the position where the annotations are displayed, select Use the icons in the tooltip popup to copy the error or
warning message to the clipboard, to hide messages of a particular type,
or to change the diagnostics settings.
To modify the colors used for underlining errors and warnings:
\list 1
\li Go to \preferences > \uicontrol {Text Editor} >
\uicontrol {Font & Colors} > \uicontrol Copy
\li Select new colors for \uicontrol Error and \uicontrol Warning.
\endlist
\section1 Set line annotation positions
To specify the position of the line annotations when looking at them in the
code editor, select \uicontrol {Annotation Settings} in the tooltip popup.
To specify the position where the annotations are displayed, go to
\preferences > \uicontrol {Text Editor} > \preferences > \uicontrol {Text Editor} >
\uicontrol Display > \uicontrol {Line annotations}, and then select \uicontrol Display > \uicontrol {Line annotations}, and then select
whether to display the annotations directly next to the code, aligned whether to display the annotations directly next to the code, aligned
@@ -62,19 +76,62 @@
between lines can be useful if there is usually not enough space to between lines can be useful if there is usually not enough space to
display annotations next to the text. display annotations next to the text.
\image qtcreator-options-text-editor-display.png "Text Editor Display preferences" \image qtcreator-options-text-editor-display.png {Text Editor Display preferences}
If you hide the annotations by deselecting the check box, you can move the If you hide the annotations, you can move the mouse pointer over an icon to
mouse pointer over an icon to view them. view them.
\if defined(qtcreator)
\section1 Inspect QML and JavaScript
To inspect QML and JavaScript properties, methods, and enums, move the
cursor over them and go to \uicontrol Tools > \uicontrol {QML/JS} >
\uicontrol {Inspect API for Element Under Cursor}.
\sa {Clangd}
\endif
\sa {JavaScript and QML Checks}
*/
/*!
\page creator-reference-js-and-qml-error-codes.html
\if defined(qtdesignstudio)
\previouspage qtquick-text-editor.html
\else
\previouspage creator-reference.html
\endif
\ingroup creator-reference-editors
\title JavaScript and QML Checks
\brief Run static checks on the QML and JavaScript code in your project to
find common problems.
To run static checks, go to \uicontrol Tools > \uicontrol {QML/JS} >
\uicontrol {Run Checks} or press \key {Ctrl+Shift+C}.
View the results in the \uicontrol QML and \uicontrol {QML Analysis}
filters in \l Issues.
\section1 Enabling and Disabling Messages
To enable and disable QML and JavaScript messages:
\list 1
\li Go to \preferences > \uicontrol {Qt Quick} >
\uicontrol {QML/JS Editing}.
\li Select \uicontrol {Use customized static analyzer}.
\image qtcreator-preferences-qtquick-qmljs-editing.webp {QML/JS Editing tab in Qt Quick preferences}
\li In \uicontrol Enabled, select the messages that you want to see.
\li To disable messages for non-Qt Quick UI files, select them in
\uicontrol {Disable messages for non Qt Quick UI}. You cannot
enable messages just for non-Qt Quick UI files.
\endlist
\section1 JavaScript and QML Error Codes \section1 JavaScript and QML Error Codes
You can run static checks on the QML and JavaScript code in your project to
find common problems. To run the checks, select \uicontrol Tools >
\uicontrol {QML/JS} > \uicontrol {Run Checks} or press \key {Ctrl+Shift+C}.
The results are shown in the \uicontrol QML and \uicontrol {QML Analysis}
filters in \l Issues.
Many of the error messages are similar to the ones in Douglas Crockford's Many of the error messages are similar to the ones in Douglas Crockford's
\l{http://www.jslint.com}{JSLint} tool. For more information about JSLint \l{http://www.jslint.com}{JSLint} tool. For more information about JSLint
errors, see \l{http://linterrors.com/js}{JSLint Error Explanations}. errors, see \l{http://linterrors.com/js}{JSLint Error Explanations}.
@@ -699,23 +756,6 @@
\endtable \endtable
\section1 Enabling and Disabling Messages
To enable and disable QML and JavaScript messages, select \preferences >
\uicontrol {Qt Quick} > \uicontrol {QML/JS Editing} >
\uicontrol {Use customized static analyzer}.
\image qtcreator-preferences-qtquick-qmljs-editing.webp {QML/JS Editing tab in Qt Quick preferences}
In \uicontrol Enabled, select the messages that you want to see.
To disable messages for non-Qt Quick UI files, select them in
\uicontrol {Disable messages for non Qt Quick UI}. You cannot
enable messages just for non-Qt Quick UI files.
\if defined(qtcreator)
\sa {Turn on QML language server}
\endif
\section1 Resetting the Code Model \section1 Resetting the Code Model
If you change the build and run kit when you have QML files open in the code If you change the build and run kit when you have QML files open in the code
@@ -723,7 +763,7 @@
indicates that this might have happened: \e{Using Qt Quick 1 code model indicates that this might have happened: \e{Using Qt Quick 1 code model
instead of Qt Quick 2}. instead of Qt Quick 2}.
You can see the error message when you move the mouse pointer over code that To see the error message, move the mouse pointer over code that
\QC underlines in the code editor or when you open a QML file in \QDS. \QC underlines in the code editor or when you open a QML file in \QDS.
To reset the code model, select \uicontrol Tools > \uicontrol {QML/JS} > To reset the code model, select \uicontrol Tools > \uicontrol {QML/JS} >
@@ -735,44 +775,38 @@
kit. kit.
\endif \endif
\section1 Inspecting QML and JavaScript \sa {Check code syntax}
*/
To inspect QML and JavaScript properties, methods, and enums, move the /*!
cursor over them and select \uicontrol Tools > \uicontrol {QML/JS} > \page creator-how-to-autoformat-qml-js.html
\uicontrol {Inspect API for Element Under Cursor}. \if defined(qtdesignstudio)
\previouspage qtquick-text-editor.html
\else
\previouspage creator-how-tos.html
\endif
\section1 Automatically Formatting QML/JS Files \ingroup creator-how-to-edit
To automatically format QML/JS files upon saving, select \preferences > \title Automatically format QML/JS files
\uicontrol {Qt Quick} > \uicontrol {QML/JS Editing} >
To automatically format QML/JS files upon saving, go to \preferences >
\uicontrol {Qt Quick} > \uicontrol {QML/JS Editing} and select
\uicontrol {Enable auto format on file save}. \uicontrol {Enable auto format on file save}.
\image qtcreator-qml-js-editing.webp {QML/JS Editing preferences}
To only format files that belong to the current project, select To only format files that belong to the current project, select
\uicontrol {Restrict to files contained in the current project}. \uicontrol {Restrict to files contained in the current project}.
To use an external tool, such as \l {qmlformat}, which automatically To use an external tool, such as \l {qmlformat}, which automatically
formats QML files according to QML coding conventions, select formats QML files according to QML coding conventions:
\uicontrol {Use custom command instead of built-in formatter}. In
the \uicontrol Command field, enter the path to the tool. In the
\uicontrol Arguments field, enter options for running the tool.
\image qtcreator-qml-js-editing.webp {QML/JS Editing preferences} \list 1
\li Select \uicontrol {Use custom command instead of built-in formatter}.
\if defined(qtcreator) \li In \uicontrol Command, enter the path to the tool.
\section1 Inspecting Preprocessed C++ Code \li In \uicontrol Arguments, enter options for running the tool.
\endlist
To analyze the causes of compile errors or errors caused by wrong includes
pulled in by dependencies or C++ macros expanding to something unexpected,
select \uicontrol {Show Preprocessed Source} in the editor context menu.
This action expands all C++ macros to their actual code and removes code that
is guarded by a currently inactive \c {#ifdef} statements. If you deselect
the \uicontrol {Use built-in preprocessor to show pre-processed files} check
box in \preferences > \uicontrol C++ > \uicontrol {Code Model}, this action
also expands all \c {"#include <foo.h>"} statements to their actual contents.
\image qtcreator-preferences-code-model.webp {C++ Code Model preferences}
\endif
\sa {Check code syntax}, {Qt Quick Code Style}
*/ */

View File

@@ -24,19 +24,6 @@
\list \list
\li \l{Writing Code}
\if defined(qtdesignstudio)
The \l{Code} view offers services, such as semantic highlighting,
syntax checking, code completion, code indentation, and in-line
error indicators while you are typing.
\else
Writing, editing, and navigating in source code are core tasks in
application development. Therefore, the code editor is one of the
key components of \QC. You can use the code editor in the
\uicontrol Edit mode.
\endif
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\li \l{Finding} \li \l{Finding}

View File

@@ -1,39 +0,0 @@
// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
// **********************************************************************
// NOTE: the sections are not ordered by their logical order to avoid
// reshuffling the file each time the index order changes (i.e., often).
// Run the fixnavi.pl script to adjust the links to the index order.
// **********************************************************************
/*!
\page creator-editor-functions.html
\previouspage creator-coding.html
\if defined(qtdesignstudio)
\nextpage creator-highlighting.html
\else
\nextpage creator-coding-navigating.html
\endif
\title Writing Code
The \QC code editor is fully equipped with semantic highlighting, syntax
checking, code completion, code indentation, context sensitive help, and
in-line error indicators while you are typing.
\list
\li \l{Checking Code Syntax}
\QC checks for errors when you write code and displays inline
error and warning messages.
Similarly, it checks the data structure of an instance of a
JavaScript object notation (JSON) entity. In addition, you can run
static checks on the QML and JavaScript code in your project to find
common problems.
\endlist
\if defined(qtcreator)
\sa {Edit Code}{How To: Edit Code}, {Edit Mode}
\endif
*/

View File

@@ -157,13 +157,9 @@
\li To process precompiled headers, deselect the \li To process precompiled headers, deselect the
\uicontrol {Ignore precompiled headers} check box. \uicontrol {Ignore precompiled headers} check box.
\li When you select \uicontrol {Show Preprocessed Source} in the code \li To use the built-in preprocessor to show the
editor context menu, the built-in preprocessor is used to show the pre-processed source file in the editor, select
pre-processed source file in the editor. To invoke the actual \uicontrol {Use built-in preprocessor to show pre-processed files}.
compiler for showing the code, deselect the
\uicontrol {Use built-in preprocessor to show pre-processed files}
check box. For more information, see
\l {Inspecting Preprocessed C++ Code}.
\li To avoid out-of-memory crashes caused by indexing huge source files \li To avoid out-of-memory crashes caused by indexing huge source files
that are typically auto-generated by scripts or code, the size of that are typically auto-generated by scripts or code, the size of
@@ -177,6 +173,19 @@
\endlist \endlist
\section1 Inspect preprocessed C++ code
To analyze the causes of compile errors or errors caused by wrong includes
pulled in by dependencies or C++ macros expanding to something unexpected,
select \uicontrol {Show Preprocessed Source} in the editor context menu.
This action expands all C++ macros to their actual code and removes code that
is guarded by a currently inactive \c {#ifdef} statements.
If you clear \uicontrol {Use built-in preprocessor to show pre-processed files},
this action also expands all \c {"#include <foo.h>"} statements to their
actual contents.
\sa {Specify clangd settings}, {Clang Code Model}, {Clangd} \sa {Specify clangd settings}, {Clang Code Model}, {Clangd}
*/ */

View File

@@ -26,7 +26,7 @@
code elements and blocks. You can use syntax highlighting code elements and blocks. You can use syntax highlighting
also for other types of files than C++ or QML. also for other types of files than C++ or QML.
\li \l {Checking Code Syntax}{Checking code syntax} \li \l {Check code syntax}{Checking code syntax}
\QC checks for errors when you write code and displays inline \QC checks for errors when you write code and displays inline
error and warning messages. Similarly, it checks the data error and warning messages. Similarly, it checks the data

View File

@@ -231,7 +231,7 @@
To disable the embedded code model and use the QML language server for everything, To disable the embedded code model and use the QML language server for everything,
select \uicontrol {Use QML Language Server advanced features}. select \uicontrol {Use QML Language Server advanced features}.
Also,\QC tries to use the QML language server shipped with Also, \QC tries to use the QML language server shipped with
the Qt version in your current kit. To override that behavior and always use the the Qt version in your current kit. To override that behavior and always use the
QML language server of the highest registered Qt version, select QML language server of the highest registered Qt version, select
\uicontrol {Use QML Language Server from latest Qt version}. \uicontrol {Use QML Language Server from latest Qt version}.

View File

@@ -27,10 +27,6 @@
\generatelist creator-tutorials \generatelist creator-tutorials
\li \l{Coding} \li \l{Coding}
\list \list
\li \l{Writing Code}
\list
\li \l{Checking Code Syntax}
\endlist
\li \l{Configuring the Editor} \li \l{Configuring the Editor}
\endlist \endlist
\li \l{Running on Devices} \li \l{Running on Devices}

View File

@@ -33,7 +33,7 @@
To override the global preferences for a particular project, select To override the global preferences for a particular project, select
\uicontrol Projects > \uicontrol {Code Style}. \uicontrol Projects > \uicontrol {Code Style}.
\sa {Indent text or code} \sa {Automatically format QML/JS files}, {Indent text or code}
\if defined(qtcreator) \if defined(qtcreator)
\sa {Find preferences}, {Specify code style} \sa {Find preferences}, {Specify code style}

View File

@@ -199,12 +199,16 @@
\li \l{Designer-Developer Workflow} \li \l{Designer-Developer Workflow}
\li \l{Coding}{Cross-Platform Development} \li \l{Coding}{Cross-Platform Development}
\list \list
\li \l{Writing Code} \li Writing Code
\list \list
\li \l{Checking Code Syntax} \li \l{Semantic Highlighting}
\li \l{Check code syntax}
\li \l{JavaScript and QML Checks}
\li \l{Qt Quick Code Style}
\li \l{Automatically format QML/JS files}
\li \l{Complete code}
\li \l{Indent text or code} \li \l{Indent text or code}
\li \l{Behavior} \li \l{Behavior}
\li \l{Qt Quick Code Style}
\endlist \endlist
\li \l{Finding} \li \l{Finding}
\list \list

View File

@@ -125,7 +125,7 @@
\li Provides a code editor for viewing and modifying the code \li Provides a code editor for viewing and modifying the code
generated by the visual editors. generated by the visual editors.
\li \image ok.png \li \image ok.png
\li \l {Writing Code} \li \l {Code}
\row \row
\li \l Projects \li \l Projects
\li Shows a list of open projects and the files they contain. \li Shows a list of open projects and the files they contain.

View File

@@ -17,10 +17,20 @@
You can also view and modify other types of text files. You can also view and modify other types of text files.
The view offers the following features: \section1 Editing Code
The code editor offers semantic highlighting, syntax checking,
code completion, code indentation, context sensitive help, and
in-line error indicators while you are typing.
For more information, see:
\list \list
\li \l{Checking Code Syntax} \li \l{Semantic Highlighting}
\li \l{Check code syntax}
\li \l{JavaScript and QML Checks}
\li \l{Qt Quick Code Style}
\li \l{Automatically format QML/JS files}
\li \l{Complete code} \li \l{Complete code}
\li \l{Indent text or code} \li \l{Indent text or code}
\li \l{Edit properties of QML types} \li \l{Edit properties of QML types}