122 lines
2.7 KiB
ReStructuredText
122 lines
2.7 KiB
ReStructuredText
Ready To Work
|
|
~~~~~~~~~~~~~~
|
|
|
|
For more information about installation, refer to the :ref:`source-install-ubuntu`
|
|
|
|
Preparation before development
|
|
------------------------------
|
|
|
|
- Node environment
|
|
|
|
- Requirement in package.json: ``"node": ">=10.22.0"``
|
|
- Verify nodejs version
|
|
|
|
.. code-block:: console
|
|
|
|
node -v
|
|
|
|
- Yarn
|
|
|
|
- Install yarn
|
|
|
|
.. code-block:: console
|
|
|
|
npm install -g yarn
|
|
|
|
- Install dependencies
|
|
|
|
- Execute in the project root directory, which is the same level as
|
|
``package.json``, and wait patiently for the installation to complete
|
|
|
|
.. code-block:: console
|
|
|
|
yarn install
|
|
|
|
- Prepare a usable backend
|
|
|
|
- Prepare an accessible backend, for example: ``https://172.20.154.250``
|
|
|
|
- Modify the corresponding configuration in ``config/webpack.dev.js``:
|
|
|
|
.. code-block:: javascript
|
|
|
|
if (API === 'mock' || API === 'dev') {
|
|
devServer.proxy = {
|
|
'/api': {
|
|
target: 'https://172.20.154.250',
|
|
changeOrigin: true,
|
|
secure: false,
|
|
},
|
|
};
|
|
}
|
|
|
|
- Configure access host and port
|
|
|
|
- Modify :guilabel:`devServer.host` and :guilabel:`devServer.port`
|
|
|
|
- Modify the corresponding configuration in ``config/webpack.dev.js``
|
|
|
|
.. code-block:: javascript
|
|
|
|
const devServer = {
|
|
host: '0.0.0.0',
|
|
// host: 'localhost',
|
|
port: 8088,
|
|
contentBase: root('dist'),
|
|
historyApiFallback: true,
|
|
compress: true,
|
|
hot: true,
|
|
inline: true,
|
|
disableHostCheck: true,
|
|
// progress: true
|
|
};
|
|
|
|
- Completed
|
|
|
|
- Execute in the project root directory, which is the same level
|
|
as ``package.json``
|
|
|
|
.. code-block:: console
|
|
|
|
yarn run dev
|
|
|
|
- Use the :guilabel:`host` and :guilabel:`port` configured in
|
|
``config/webpack.dev.js`` to access, such as ``http://localhost:8088``
|
|
|
|
- The front-end real-time update environment used for development is done.
|
|
|
|
Front-end package used in production environment
|
|
------------------------------------------------
|
|
|
|
Have the required ``nodejs`` and ``yarn``
|
|
|
|
Execute in the project root directory, which is the same level
|
|
as ``package.json``
|
|
|
|
.. code-block:: console
|
|
|
|
yarn run build
|
|
|
|
The packaged files are in the ``dist`` directory and handed over
|
|
to the deployment personnel.
|
|
|
|
Front-end package used for testing
|
|
-----------------------------------
|
|
|
|
Have the required ``nodejs`` and ``yarn``
|
|
|
|
Execute in the project root directory, which is the same level
|
|
as ``package.json``
|
|
|
|
.. code-block:: console
|
|
|
|
yarn run build:test
|
|
|
|
The packaged files are in the ``dist`` directory
|
|
|
|
.. note::
|
|
|
|
This test package is designed to measure code coverage
|
|
|
|
It is recommended to use nginx to complete the E2E test with code coverage
|